弹窗vue.js组件的设计思路，关闭按钮应该如何控制？

Question

如果要设计一个弹窗vue.js组件。假如外部可以通过v-if控制他的展示与隐藏。但弹窗内部有个关闭按钮也可以控制自己的隐藏和展示。 请问如何把外部控制和内部控制关联起来呢？

一个比较严重的问题是： 组件内部是不能或者不建议去修改外部传入的变量的； 另一方面假如用2个变量来控制组件隐藏展示，那么内部隐藏后，外部又无法让弹窗展示。

Answer 1

一、可以参照一下Element的做法，

Element是使用.sync修饰符来达到props双向绑定效果的（vue1.x中是双向绑定，2.x中只是v-on语法糖）
具体文档可以看这里

二、当然，我个人的做法是：在弹框组件内部使用定义一个变量去控制组件的显隐，然后通过ref来调用组件内部的方法从而达到控制弹框的效果。

具体的话，可以参照这个：https://github.com/Ash-sc/vue...