vue项目开发中如何利用filter过滤器实现模糊搜索,下面编程教程网小编给大家简单介绍一下具体实现方法!
1、过滤器方法
Vue.filter('search', function (value, searchString) {
if (!searchString) return value;
searchString = searchString.trim().toLowerCase();
return value.filter(function(item) {
if (item.name.toLowerCase().indexOf(searchString) !== -1) {
return true;
}
})
});
2、html代码
<input type="text" v-model="searchString">
<ul>
<li v-for="item in items | search(searchString)">
{{ item.name }}
</li>
</ul>
以上是编程学习网小编为您介绍的“vue如何利用filter过滤器实现模糊搜索”的全面内容,想了解更多关于 vuejs 内容,请继续关注编程基础学习网。
沃梦达教程
本文标题为:vue如何利用filter过滤器实现模糊搜索


猜你喜欢
- 浅谈javascript的url参数parse和build函数 2024-01-17
- [翻译] JW Media Player 中文文档第4/4页 2023-12-23
- el-tree实现拖动置顶排序 2024-12-07
- javascript cookie的基本操作(添加和删除) 2024-01-14
- CSS 鼠标悬浮在图片上添加遮罩层效果的实现 2024-01-05
- Typescript + Vue + Eslint使用不报错的方法总结。 2023-10-08
- 解决IE下AjaxSubmit上传文件提示下载文件问题 2023-02-01
- 在CHtmlView中指定IE版本 2023-10-27
- ajax实现无刷新上传文件功能 2023-02-14
- JavaScript编写推箱子游戏 2024-01-17