Javascript 如何从插槽子定义与vue 2.x中的包含组件通信？

我正在编写一个简单的工具提示组件。工具提示的内容由vue插槽定义。我希望槽的内容能够发出关闭工具提示的信号，就像工具提示可以从自己的模板关闭自己一样

下面是示例代码：

Vue.component（'vtip'{
已创建：函数（）{
此.$on（'closeDialog'，函数（a、b、c）{
log（“[closeDialog in vtip]”，a、b、c、this）；
this.closeDialog（）；//idfk
});
},
道具：[“按钮文字”]，
模板：“#vtip_模板”，
方法：{
关闭对话框：函数（事件）{
var$dialog=$（this.$refs.dialog）；
$dialog.fadeToggle（'fast'）；
},
切换对话框：函数（事件）{
var$button=$（this.$refs.button）；
var$dialog=$（this.$refs.dialog）；
var button_left=$button.position（）.left；
var button_top=$button.position（）.top；
var-extras=2；
var-arrow_size=10；
var new_pos={left:button_left+'px'，top:button_top+$button.height（）；
$dialog.css（新位置）；
$dialog.fadeToggle（'fast'）；
},
}
});
var v_应用程序；
$（文档）.ready（函数（）{
v_应用程序=新的Vue({
el:“#v#U应用程序”，
});
});
正文{
背景：#eee；
填充：1em；
字体系列：Verdana；
字号：11pt；
}
.对话{
背景：#222；
颜色：#eee；
边框：2倍纯白；
显示：无；
盒影：0 4px 8px 0 rgba（0,0,0,0.2），0 6px 20px 0 rgba（0,0,0,0.19）；
边界半径：4px；
位置：绝对位置；
}
.dialog.item body.item body{
填料：1米1米；
}
.dialog.item主体{
最小宽度：10em；
填充物：0.5em 1em；
}

...
1.点击嘿。

2.如何使“是！”按钮像“x”链接一样关闭组件？

你确定吗？
对
您可以将
ref
属性添加到
vtip
组件标记，然后通过
$refs
对象引用组件的
closeDialog
方法：

<vtip button_text="hey" ref="tip">
    Are you sure?
    <button @click="$refs.tip.closeDialog()">Yes!</button>
</vtip>   

正文{
背景：#eee；
填充：1em；
字体系列：Verdana；
字号：11pt；
}
.对话{
背景：#222；
颜色：#eee；
边框：2倍纯白；
显示：无；
盒影：0 4px 8px 0 rgba（0,0,0,0.2），0 6px 20px 0 rgba（0,0,0,0.19）；
边界半径：4px；
位置：绝对位置；
}
.dialog.item body.item body{
填料：1米1米；
}
.dialog.item主体{
最小宽度：10em；
填充物：0.5em 1em；
}

...
1.点击嘿。

2.如何使“是！”按钮像“x”链接一样关闭组件？

你确定吗？
对