vue3搜索时，筛选出符合条件的数据，并且记录筛选条件

对于Vue 3的搜索功能，可以使用computed属性来筛选符合条件的数据，并使用watchEffect来监听筛选条件的变化并记录。

例如，假设我们有一个名为“items”的数组，其中包含多个对象，每个对象都有一个名为“name”的属性。我们还有一个包含搜索条件的data属性“searchQuery”。

我们可以创建一个computed属性，该属性将筛选出符合搜索条件的项。代码示例如下：

computed: {
  filteredItems() {
    return this.items.filter(item => {
      return item.name.toLowerCase().includes(this.searchQuery.toLowerCase());
    });
  }
}

然后，我们可以使用watchEffect来监听searchQuery属性的变化，并在每次变化时记录筛选条件。代码示例如下：

watchEffect(() => {
  console.log(`Search query changed to: ${this.searchQuery}`);
});

这将在控制台中记录筛选条件的变化。