antd-vue的table组件的筛选自动清空

2021-12-21  本文已影响0人  花影_62b4

思路:把columns放在computed,并设置filteredValue为filters对应的属性,filters在table的change事件的第二个参数可以取到

computed: {
let columns(){
      let columns = [
        {
          title: "店铺名称",
          dataIndex: "shopEntityName",
          key: "shopEntityName",
          width: 120,
          ellipsis: true,
          fixed: "left",
        },
        {
          title: "楼层",
          dataIndex: "storey",
          key: "storey",
          width: 75,
          fixed: "left",
          filterMultiple:false,
          filters: this.floorList,   
          filteredValue: (this.filteredInfo&&this.filteredInfo.storey) || null,          
        },
        {
          title: "业种",
          dataIndex: "shopTypeName",
          key: "shopTypeName",
          width: 75,
          fixed: "left",
          filterMultiple:false,
          filters: this.typeList,
          filteredValue: (this.filteredInfo&&this.filteredInfo.shopTypeName) || null,
        },
]
return columns;
}
},
methods:{
  clear(){
      this.filteredInfo=null;
  }
}

2、fixed和ellipsis和row-selection一起用时,ellipsis失效问题解决
.passAuditPage ::v-deep.ant-table-fixed-left table,.passAuditPage ::v-deep.ant-table-fixed-right-right table{ width:min-content; }

上一篇下一篇

猜你喜欢

热点阅读