vue el-table 自定义表头 el-select使用
el-table有一个自定义属性render-header < el-table-column v-for="(headItem,index ) intableHeadBill" :key=index" align="center" :prop="headItem.value&qu
el-table有一个自定义属性render-header
< el-table-column v-for="(headItem,index ) intableHeadBill" :key=index"
align="center"
:prop="headItem.value"
:label=""
:render-header = 'renderHeaderBill'>
renderHeaderBill方法使用:
renderHeaderBill(h, data) {
let filters = [ {text:'全部1','value':"1"} , {text:'全部2','value':"2"} , {text:'全部3','value':"3"} ];
return h('div',{
style: {
height:'30px'
},
},[
h(
"el-select",
{
props: {
placeholder:'',
value: '',//默认值
clearable:false,
popperClass:'popperClassResOut',//样式
},
class: selectClass,
on: {
input: value => {
this.$emit("update:param", value);
//select 选中值
}
this.callback &&this.callback();
}
}
},
[
filters.map(item => {
return h("el-option", {
props: {
value: item.value,
label: item.text
}
});
})
])
])
},
更多推荐
所有评论(0)