<uni-search-bar @confirm="search" @input="input" ></uni-search-bar> 怎么用呢？

`<uni-search-bar>` 是 UniApp 中的一个组件，用于创建搜索框。它接受一些事件监听器，如 `@confirm` 和 `@input`，用于响应用户的输入和确认操作。

使用 `<uni-search-bar>` 的基本语法如下：

<uni-search-bar :placeholder="placeholder" @confirm="search" @input="input" :bgColor="bgColor" :radius="radius">
    <!-- 可选的slot区域，用于自定义搜索图标 -->
    <template v-slot:searchIcon>
        <uni-icons :custom-prefix="customPrefix" :type="searchType" :size="searchSize" @click="search"/>
    </template>
</uni-search-bar>

其中:

- `placeholder`: 设置搜索框的提示文本，默认为空字符串。
- `@confirm="search"`: 当用户点击搜索按钮时触发的回调函数，你可以在这里实现搜索逻辑。
- `@input="input"`: 用户在搜索框内输入时触发的回调函数，可以用来实时更新状态或执行其他操作。
- `bgColor` 和 `radius`: 分别设置背景颜色和圆角半径，可以根据设计需求调整。
- `v-slot:searchIcon`: 通过插槽（slot）来替换默认的搜索图标，你可以传入自定义的`uni-icons`组件并指定`type`属性来改变图标样式，如`type="bjs-search"`示例中的做法。

要自定义清除按钮或取消按钮，可以在`<uni-search-bar>`组件中添加另一个`slot`，比如`clearIcon`：

<!-- 自定义清除按钮的示例 -->
<uni-search-bar placeholder="自定义clearIcon">
    <view slot="clearIcon" :style="{ color: clearButtonColor }">X</view>
</uni-search-bar>

在这里，`clearButtonColor`是用于设置清除按钮颜色的变量名。当需要显示或隐藏这个清除按钮，只需修改相应的CSS样式即可。