详解Vue组件插槽的使用以及调用组件内的方法

export default {
 props: [\'options\'],
 data(){
 return {}
 }
}

<div class=\"dialog\">
 我是对话框
 <slot name=\"slotA\"></slot>
</div>

<dialog-a :options=\"hello\">
 <template slot=\"slotA\">
 <button>按钮</button>
 // ... 可以是任何元素
 </template>
</dialog-a>

<div class=\"dialog\">
 我是对话框<br>
 {{message}}
 <slot name=\"slotA\" :message=\"message\"></slot>
</div>

<dialog-a :options=\"hello\">
 <template slot=\"slotA\" slot-scope=\"scope\">
 <button>{{scope.message}}</button>
 </template>
</dialog-a>

<dialog-a ref=\"dialogA\"></dialog-a>

test(){
 this.$refs.dialogA.func()
}