问题描述
我试图将一些数据设为小写(总是小写)
I trying to make some data to lowercase (alway lowercase)
我制作和搜索输入如下:
I making and search input like :
<template id="search">
<div>
<input type="text" v-model="search">
<li v-show="'hello'.includes(search) && search !== ''">Hello</li>
</div>
</template>
</模板>
Vuejs : (component)
Vuejs:(组件)
I tried
watch
, But I dont want input showing lowercase when typing
我试过watch
,但我不想输入时输入显示小写
watch: { 'search' : function(v) { this.search = v.toLowerCase().trim(); }}
Demo : https://jsfiddle.net/rgr2vnjp/
演示: https://jsfiddle.net/rgr2vnjp/>
而且我不想在搜索列表 v-show
上添加 .toLowerCase()
像:
<li v-show="'hello'.includes(search.toLowerCase()) && search !== ''">Hello</li>
有什么技巧吗?,我搜索过,很多人告诉我只使用 filter
而不是在 Vuejs 2 上退出
Any trick?, I searched and many tell just use filter
but not exits on Vuejs 2
游乐场: https://jsfiddle.net/zufo5mhq/(尝试输入H)
PS:好的/更好的代码我也想知道,谢谢
推荐答案
在 Vue.js 2.0 中,计算属性可用于替换过滤器:
In Vue.js 2.0, computed properties can be used to replace filters:
computed: {
searchInLowerCase() {
return this.search.toLowerCase().trim();
}
}
现在您可以在模板中简单地使用 searchInLowerCase
:
And now you can simply use searchInLowerCase
in your template:
<li v-show="'hello'.includes(searchInLowerCase) && search !== ''">Hello</li>
这篇关于Vuejs 2:如何使数据小写的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!