我需要一段vue2模糊查询的代码
时间: 2023-06-06 21:04:50 浏览: 87
ctrl+f功能demo代码
以下是一个简单的基于vue2的模糊查询示例代码:
```
<template>
<div>
<input v-model="searchQuery" placeholder="Search...">
<ul>
<li v-for="item in filteredList">{{ item }}</li>
</ul>
</div>
</template>
<script>
export default {
data() {
return {
searchQuery: '',
list: ['apple', 'banana', 'cherry', 'date']
};
},
computed: {
filteredList() {
return this.list.filter((item) => {
return item.toLowerCase().indexOf(this.searchQuery.toLowerCase()) !== -1;
});
}
}
};
</script>
```
在这个代码示例中,我们使用了vue2的双向绑定v-model,可以根据用户输入的搜索词动态过滤出符合条件的列表项,并且忽略搜索词的大小写敏感性。如果您需要进行更复杂的模糊查询或者搜索功能,可以根据实际需要进行相应的修改。
阅读全文