由于数据需要根据列筛选选中的值做特殊的处理,所以我要把选中值传到后端。
代码:
<el-table
:data="tableData"
style="width: 100%"
@filter-change="handleFilterChange">
<el-table-column
prop="tag"
label="标签"
column-key="nv_date"
:filters="filterList">
</el-table-column>
</el-table>
<script>
export default {
data() {
return {
filterList: [
{text: '2019-08-06',value: '2019-08-06'},
{text: '2019-07-06',value: '2019-07-06'},
{text: '2019-06-06',value: '2019-06-06'}],
selectList: []
}
},
methods: {
handleFilterChange(val){
// console.info(val)
this.selectList= val['nv_date']
// 调用API
},
}
}
</script>
关键:
1、给el-table-column绑定需要筛选的项 :filters
2、给el-table绑定:filter-change
事件,当筛选项发现变化时调用该事件
3、给筛选列定义:column-key
属性,因为可以直接根据列的key值获取数据
如有问题,欢迎交流~!