element-ui中表格的表頭增加icon并設定點擊事件
- 首先看element-ui中給出的渲染label的函式
render-header - element組件庫
<el-table-column prop="id" label="申請編號":render-header="renderHeader">
</el-table-column>
<script>
method: {
renderHeader(h, { column, $index }) {
// h 是一個渲染函式 column 是一個物件表示當前列 $index 第幾列
let vm = this
return h('div', null,[
h("span", column.label + " ", { //這是左邊的
align: "left"
}),
h('span',null,[ //這個是渲染出來的icon
h('i',{
class :'el-icon-d-arrow-right', //組件庫的icon，可根據需要修改
style:"margin-left: 5px; cursor: pointer;",
on:{
click: function () {
console.log(1)
}
}
},'')
]),
])
}
}
</script>
- 最后效果圖
轉載請註明出處，本文鏈接：https://www.uj5u.com/qianduan/242896.html
標籤：其他
上一篇：nginx解決跨域問題