1、新建组件:components/Test.vue
<template>
<div>
{{title}}
</div>
</template>
<script>
export default {
name: "Test",
data () {
return {
title: '我擦嘞!!!',
type: 'A',
user: {
name: '小甲',
age: '19',
sex: '男'
},
}
}
}
</script>
<style scoped>
</style>
2、主组件App.vue这样写
<template>
<div id="app">
<img src="./assets/logo.png">
<!-- 3.在template中就可以直接使用了 -->
<Test></Test>
</div>
</template>
<script>
// 1.使用import导入你子组件
import Test from "./components/Test";
export default {
name: 'App',
// 2.写入子组件
components: {Test}
}
</script>
<style>
</style>
Vue.js如何导入新组件
猜你喜欢
转载自blog.csdn.net/qq_33867131/article/details/81235750
今日推荐
周排行