1.在main.js中添加一个bus实例
Vue.prototype.bus=new Vue();
2.分享按钮 加点击事件;把这个true值传给组件二
<a href="#"
class="wap-zl-share"
@click="share1">
</a>
<script>
export default {
data () {
return {
'isShow': true
}
},
methods: {
sharecl () {
this.bus.$emit('sharecl', this.isShow)
// console.log(this.isShow)
}
},
}
</script>
3。默认组件二的分享组件为隐藏;组件二分享组件接受一传过来的值;点击取消按钮iscancle改为false
<div class="wapshare"
v-show="iscancle">
我是分享内容
<p class="share_cancle"
@click="cancle">取消</p>
</div>
<script>
export default {
data () {
return {
'isShow': false,
}
},
created () {
this.bus.$on('sharecl', isShow=> {
this.isShow= isShow
})
},
methods: {
cancle () {
this.isShow= false
// console.log(isShow)
}
},
}
</script>