ant design vue输入框模糊筛选表格数据，并将筛选结果展示

可以使用 Ant Design Vue 的 Table 和 Input 组件来实现输入框模糊筛选表格数据，并将筛选结果展示。具体实现步骤如下：

1. 在 Table 组件中设置 dataSource 属性为表格数据源，columns 属性为表格列的配置。

2. 在 Input 组件中设置 v-model 双向绑定输入框的值。

3. 在 Input 组件的 @input 事件中，通过筛选算法过滤出符合要求的表格数据。

4. 将筛选后的数据赋值给 dataSource，表格会重新渲染，展示筛选结果。

下面是示例代码：

<template>
  <div>
    <a-input v-model="searchText" placeholder="请输入关键词"></a-input>
    <a-table :columns="columns" :dataSource="filteredData"></a-table>
  </div>
</template>

<script>
export default {
  data() {
    return {
      data: [
        { name: '张三', age: 18, address: '北京市' },
        { name: '李四', age: 20, address: '上海市' },
        { name: '王五', age: 22, address: '广州市' }
      ],
      searchText: ''
    }
  },
  computed: {
    filteredData() {
      return this.data.filter(item => {
        const regExp = new RegExp(this.searchText, 'i')
        return regExp.test(item.name) || regExp.test(item.address)
      })
    },
    columns() {
      return [
        { title: '姓名', dataIndex: 'name' },
        { title: '年龄', dataIndex: 'age' },
        { title: '地址', dataIndex: 'address' }
      ]
    }
  }
}
</script>

在上面的示例代码中，我们定义了一个 data 数组作为表格数据源，每个数组元素表示一行数据，包含 name、age、address 三个属性。

在 Input 组件中，我们使用 v-model 双向绑定 searchText 变量，表示输入框中的值。

在 computed 中，我们定义了一个 filteredData 计算属性，表示筛选后的数据。在 filteredData 中，我们使用 filter 方法对 data 数组进行筛选，筛选出 name 或 address 属性中包含 searchText 的数据。

在 columns 中，我们定义了表格列的配置。

最后，在 Table 组件中，我们使用 filteredData 作为 dataSource 属性值，表示展示筛选结果。当 searchText 变量发生变化时，filteredData 会重新计算，表格会重新渲染，展示筛选结果。