uniapp 模糊搜索
时间: 2023-09-11 07:08:27 浏览: 272
在uniapp中进行模糊搜索的方法可以使用下拉模糊搜索框。通过编写简单的js文件,可以将现有的下拉框改成支持汉字拼音首字母模糊匹配和字符串字串匹配的下拉模糊搜索框。这样在内容过多时,就能更方便地找出想要的选项。
以下是一个示例代码,展示了如何在uniapp中实现下拉模糊搜索功能:
```html
<view class="grabble">
<view class="grabble_view">
<input type="text" v-model="valueaa" placeholder="输入姓名搜索" />
</view>
<view @click="grabble">搜索</view>
</view>
```
在js文件中,需要定义一个`valueaa`变量来获取输入框中的值。还需要定义一个`data`数组来存储要展示在页面上的内容,以及一个`dataa`数组来存储接口获取的总数据。在`grabble`方法中,首先判断输入框是否为空,如果为空,则展示全部数据;否则执行以下内容:首先清空展示的数据,然后遍历全部数据,判断数据中是否有符合输入的内容,如果有,则将其添加到要展示的数组中。
这样就可以实现在uniapp中进行模糊搜索的功能了。以上代码仅为示例,具体的实现方式可以根据需求进行个性化调整。<span class="em">1</span><span class="em">2</span><span class="em">3</span>
#### 引用[.reference_title]
- *1* [下拉框变成下拉模糊搜索框](https://download.csdn.net/download/u011015125/9910128)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 50%"]
- *2* *3* [uni-app——模糊搜索](https://blog.csdn.net/qq_49552046/article/details/113481729)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 50%"]
[ .reference_list ]
阅读全文