Vue使用van-search和监听@Watch实现搜索方式
作者：勋勋勋勋小勋勋
文章介绍了Vant UI的van-search组件在不同设备的搜索触发方式：PC端按回车键,移动端点击输入法搜索按钮；并提到使用@Watch监听输入框数据变化,尤其关注取消或删除操作后的状态更新
使用van-search监听@Watch实现搜索
van-search
在输入框输入数据，当在PC端点击回车开始搜索，在手机端点击输入法中的搜索开始搜索，
@Watch
主要用于当点击取消或删除输入框中的数据监听数据的变化
- .vue
<van-search v-model="keywordSubordinate" placeholder="请输入搜索关键词" @search="querySubordinateList" />
- .ts
private keywordSubordinate = "";
@Watch("keywordSubordinate")
onkeywordSubordinateChanged(newVal: string, oldVal: string) {
if (!newVal || newVal === "") { //当输入框为空时
this.querySubordinateList();
}
}
private querySubordinateList() {
}
总结
以上为个人经验，希望能给大家一个参考，也希望大家多多支持脚本之家。