【文件属性】：
文件名称：vue组件的使用.md
文件大小：1KB
文件格式：MD
更新时间：2022-06-05 08:57:20
vue
vue组件的使用
1组件就是一个vue文件，在一个vue文件里面去使用组件，首先需要引用，并注册，代码如下
import Zujian1 from './Zujian1.vue'
export default{
components:{Zujian1},
name:"Index",
data(){
return{
}
}
}
2组件文件如下所示
hello
[removed]
export default{
name:"Zujian1",
data(){
return{
}
},
mounted() {
},
methods:{
}
}
[removed]
<style>
</style>
3组件间的传值，父组件传值给子组件props。并在子组件调用子组件方法，需要引用的文件代码实例如下
[removed]
import Zujian1 from './Zujian1.vue'
export default{
components:{Zujian1},
name:"Index",
data(){
return{
posts: [
{ id: 1, title: 'My journey with Vue' },
{ id: 2, title: 'Blogging with Vue' },
{ id: 3, title: 'Why Vue is so fun' }
]
}
}
}
[removed]
<style>
</style>
引用文件完整代码如下
{{counter}}
[removed]
export default{
name:"Zujian1",
props: ['title'],
data(){
return{
counter: this.title
}
},
mounted() {
},
methods:{
ceshi(){
alert(this.counter)
}
}
}
[removed]
<style>
</style>
