父传子:
在父组件用v-bind绑定一个值,如
v-bind:selectColl = "selectCollect"
声明:
data (){
return {
selectCollect: ""
}
}
在methods方法中给selectCollect赋值,如
this.selectCollect = ""
在子组件中用props接受父组件绑定的值,如
props: {
selectCol: String
}
然后在子组件中使用使用接收到的该值,如
data (){
return {
activeTag: ""
}
}
watch:{
selectCol (val){
this.activeTag = val
}
}
子传父:
先在子组件中定义一个方法,然后在子组件方法中使用this.
e
m
i
t
,
t
h
i
s
.
emit,this.
emit,this.emit有两个参数,第一个是"自定义函数",第二个就是传递的参数值,如
methods: {
submitChose: {
this.$emit(event:"selectTag",args:data);
}
}
然后在父组件中使用v-on来监听子组件方法中使用的this.$emit的自定义函数,如
v-on:selectTag="selectTagsss"
methods: {
selectTagsss: function(data){
.......
}
}
其实就相当于click事件,触发一个方法,那通过执行子组件中定义的方法从而触发this.
e
m
i
t
的
自
定
义
函
数
父
组
件
监
听
到
子
组
件
中
t
h
i
s
.
emit的自定义 函数父组件监听到子组件中this.
emit的自定义函数父组件监听到子组件中this.emit自定义函数的触发,就会触发自身定义的方法,这个方法接收来自子组件的值。
另外,在父组件中也可能使用该方法:
methods: {
showTags: function(data){
this.selectTagsss = "ss"
}
}