动态编译的需求：
如在写一个表格组件时，我们可能需要表格的某一列是可定制化的，比如这一列可实现点击响应一个事件，要实现这样一个需求，可通过写配置文件的方式实现
实现方式1
data(){
let me = this
return {
name:'点我',
list:[
{name:'cccc11212121', callback:function(value){
return {
template:`<a href="javascript:void(-1)" @click="callback(value)" >{{value.name}}</a>`,
methods:{
callback:me.showName
},
data(){
return {
value:value
}
}
}
}},
{name:'bbbbb'},
{name:'ccccc'},
{name:'ddddd'},
{name:'eeeee'},
{name:'fffff'},
{name:'ggggg'}
]
}
}
之后在子组件使用is动态添加组件方式调用这个回调函数
<component :is='o.callback(o)'></component>
实现方式2
通过vuex方式管理状态
实现方式3
通过vue render方法实现，参看elementui源码
实现方式4
通过作用于插槽实现
在父组件中定义template，通过scope接收子组件的临时变量
<u-list :datas="list" @clickme="showName()">
<template slot="callback" scope="props">
<a href="javascript:void(-1)" @click="show(props.text)" >{{props.text["name"]}}</a>
</template>
</u-list>
接着在子组件中向父组件传递变量
<li v-else="o.callback">
<!-- <component :is='o.callback(o)'></component> -->
<slot name="callback" :text="o"></slot>
</li>
