vue模糊搜索

最新推荐文章于 2024-09-03 02:01:58 发布

少年包青菜

最新推荐文章于 2024-09-03 02:01:58 发布

阅读量99

点赞数

文章标签： vue

本文链接：https://blog.csdn.net/m0_50884068/article/details/119041485

版权

话不多说上代码

<div>
        <input type="text" v-model="sou">
       <div  v-for="(item,index) in btnsou()" :key="item.id">
			<div>{{item.aaa}}</div>
			<div>{{item.bbb}}</div>
		</div>
    </div>

return{
	sou: '',
            datalist: [
             {"id": 1,"aaa": "路飞","bbb": "猿王枪"},
             {"id": 2, "aaa": "索隆","bbb": "狮子歌歌"}, 
             {"id": 3,"aaa": "山治","bbb": "恶魔风脚"}
             ]

}

computed: {
            jisuan() {
                if (this.sou) {
                    return this.datalist.filter((val) => 
                        return val.aaa.includes(this.sou); 
                    }); 
                }
            }
        },
        methods: {
            btnsou() {
                if (!this.sou) {
                    return this.datalist;
                }
                return this.jisuan
            }
        },