1、父子组件
1.先引用:先在父组件页面中引用子组件
import 给你引用的文件起个名字 from “引用地址”
import zi from “./zi” 不加后缀名./为同级
2.后调用:在父组件中与data同级处创建
components:{zi}
3.再使用:在父组件的模板中使用子组件
2、正向传值
1.在子组件中先建立一个props等待传值
2.在子组件被调用的时候传递父组件的数据
3.在子组件中展示props定义的数据
3、反向传值:必须通过事件触发
1.定义事件并且调用自定义事件
<button @click=“fun()”>点我触发自定义事件
。。。。。
methods:{
fun(){
this.$emit(‘zipao’,this.zitex)
}
}
2.在父组件中调用子组件的地方接收数据
<zi :prozi=“msg” @zipao=“rec”>
。。。。。。。
methods:{
rec(shou){
this.msg=shou;
}
}
3.显示数据
v-for中:key="i"属性的使用:目的提高vue的执行效率