Vuejs 2：如何使數據小寫

Question

我試圖做一些數據轉換爲小寫（送花兒給人小寫）

我製作和搜索輸入，如：

<template id="search"> 
    <div> 
     <input type="text" v-model="search"> 
     <li v-show="'hello'.includes(search) && search !== ''">Hello</li> 
    </div> 
</template> 

Vuejs：（組件）

Vue.component('search', { 
    template : '#search', 
    data: function(){return{ 
     search : '', 
    }} 
}); 

---

我試過watch，但我不想輸入顯示小寫輸入

watch: { 
    'search' : function(v) { 
     this.search = v.toLowerCase().trim(); 
    } 
} 

演示時：https://jsfiddle.net/rgr2vnjp/

---

而且我不想搜索列表v-show像添加.toLowerCase()：

<li v-show="'hello'.includes(search.toLowerCase()) && search !== ''">Hello</li> 

---

任何詭計？，我搜索，許多人告訴只是使用上Vuejs filter但不退出2

遊樂場：https://jsfiddle.net/zufo5mhq/（嘗試鍵入^h）

PS：好/更好的代碼，我想也知道，由於

Answer 1

在Vue.js 2.0，計算性能，可用於替換過濾器：

computed: { 
    searchInLowerCase() { 
    return this.search.toLowerCase().trim(); 
    } 
} 

現在你可以簡單地使用searchInLowerCase在您的模板：

<li v-show="'hello'.includes(searchInLowerCase) && search !== ''">Hello</li> 

Answer 2

你甚至可以做到這一點

{{tag.title.toLowerCase().trim()}}