如何调用vue组件的功能？

Question

根据我的理解，Vue组件是一个类， 所以我可以把它包括在内：

import MyDialogComponent from './MyDialog.vue'

创建一个实例：

<my-dialog-component/>

看起来我可以分配visibility属性，如：

prop: ['showDialog'] //delcare property
...
<md-dialog :md-active.sync="getActive"> 
...
computed:{ getActive: function () { return this.showDialog } } 
...
<my-dialog-component show-dialog='true'/>

使对话框组件可见。当我尝试通过按钮单击显示对话框时。 一切都变得复杂。许多变量需要在双方声明和绑定。但实际上我只使用了一个属性，即MyDialog的可见性。

所以要显示MyDialog，无论如何这样？

myDialog1.showMe()

调用实例的公共函数。

Answer 1

您可以在组件中添加ref

例如：<my-dialog-component ref="dialog1" />

然后在你的代码中：

this.$refs.dialog1.showMe()