vue實現簡單的過濾器
阿新 • • 發佈:2018-12-06
html片段:
<script src="https://unpkg.com/vue"></script> <div id="app"> <p>{{ message | capitalize}}</p> </div>
js片段:
全域性過濾器:
Vue.filter('capitalize', function (data) { let arr = data.split('/'); return arr[2] + '(' + arr[0] + arr[1] + ')'; }) new Vue({ el:'#app', data: { message: '湖南省/長沙市/嶽麓區嶽麓大道588號' } })
元件本地過濾:
new Vue({ el: '#app', data: { message: '湖南省/長沙市/嶽麓區嶽麓大道588號' }, filters:{ capitalize: (data) => { let arr = data.split('/'); return arr[2] + '(' + arr[0] + arr[1] + ')'; } } })
結果:
嶽麓區嶽麓大道588號(湖南省長沙市)