子组件调用父组件中的方法
因为我自己不会写,查了好几个方法都不行。
本来是想用 parent 的,但是项目也不知道是iveiw的原因还是什么,报错提示 is not a function
所以最后用了emit
上才艺
父组件
1、给父组件里的子组件注册被监听的方法 @事件名称 = ' 函数名称() ' 【v-on可以简写成 @ 】
2、monitor()这个方法里给监听到变化后的操作
//引用子组件
<template>
<ZiZuJian @savesucceed="monitorSave"></ZiZuJian>
</template>
<script>
import ZiZuJian from '...........';
export default{
components:{
ZiZuJian,
}
methods:{
// 监听子组件事件执行
monitorSave() {
this.list(); //执行获取数据的方法(这里面写变化后的操作)
},
}
}
</script>
子组件
1、利用this.$emit( ' 父组件监听的方法名 ' , 参数 );
我百度查了一下$emit目的是发布事件,这个事件的参数,没有的话默认为0,父组件监听后只知道点击了。
这个地方现在还不是很懂,没有参数也可以执行,不会报错。
<template>
<span v-show="show"> 小肆是不是很可爱? </span>
<button @click="save">保存<button>
</template>
<script>
export default{
methods:{
data:{
show = false;
}
// 被监听的事件操作
save() {
this.show = true;
this.$emit('savesucceed',this.show)
},
}
}
</script>
告辞!