:showSearch.sync

showSearch.sync 是一个 Vue.js 中的内置指令。它用于在同步模式下显示一个搜索框，并且可以与一个响应式数据进行绑定。这个指令通常用于实现实时搜索功能。

使用 showSearch.sync 指令，你可以将一个响应式的数据对象与搜索框进行绑定。当用户在搜索框中输入内容时，该数据对象会自动更新，从而实现搜索关键词的实时响应。同时，你也可以通过修改这个数据对象来控制搜索框的显示或隐藏。

需要注意的是，.sync 修饰符表示将变量的更新反映到指令所绑定的元素上。这意味着当响应式数据对象发生变化时，搜索框的值会同步更新，反之亦然。

示例用法：

<template>
  <div>
    <input type="text" v-model="searchTerm" v-show="showSearch" />
    <button @click="toggleSearch">Toggle Search</button>
  </div>
</template>

<script>
export default {
  data() {
    return {
      searchTerm: '',
      showSearch: false,
    };
  },
  methods: {
    toggleSearch() {
      this.showSearch = !this.showSearch;
    },
  },
};
</script>

在上述示例中，input 元素通过 v-model 指令与 searchTerm 变量进行双向绑定。通过 v-show 指令控制搜索框的显示与隐藏。toggleSearch 方法通过修改 showSearch 变量的值来切换搜索框的显示状态。