标签：el 表格 column 接口 element table 筛选
目录
（一）问题描述
element官网例子，表格筛选如下图。
官网链接：https://element.eleme.cn/#/zh-CN/component/table
如果你的表格分页了，那么这个筛选只能筛选当页的数据，原因是我门从接口得到的数据只有当页的。此时，我们要做全局筛选，即选择一个筛选条件，请求接口，接口返回给你本页的所有符合条件的数据。
为什么做全局筛选？
如果纯前端筛选，在本页数据就没有符合条件的数据时，筛完之后，表格为空。但是，符合这个条件的数据在其他页面有啊。感觉就像没有符合这个筛选条件的数据一样。
前后端结合的全局筛选，向后端发送筛选条件之后，后端把所有符合条件的都返回。
（二）实现步骤
1. el-table 中添加 @filter-change="handleFilterChange"
<el-table
:data="tableData"
class="my-table"
@filter-change="handleFilterChange"
>
2. el-table-column中添加column-key="给这一列取一个唯一标识"
<el-table-column
:key="item.id"
:prop="item.id"
:label="item.name"
column-key="keyStatus">
</el-table-column>
3. 筛选
handleFilterChange(val) {//参数val是你选择的筛选条件
//把这个筛选条件通过接口传给后端，让后端去筛
},
//有错误，请指正，接受批评，万分感谢。
标签：el,表格,column,接口,element,table,筛选 来源： https://blog.csdn.net/honeymoon_/article/details/121540837
本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享； 2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关； 3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关； 4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除； 5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。