之前vue1.0的过滤器真的很好使,但是作者为了不让搬运工变得太菜。硬是砍去了过滤器,为此,我还哭了好一阵,终于,一点一点的弄明白了过滤器是怎么回事后,也学明白了vue里的属性监听器computed以及框架里提供的filter的使用,觉得,作者这样做是对的。
先来一个模糊搜索
<ul> <li v-for="user in newUsers" > {{ user.code }} </li> </ul> new Vue({ el: '.app', data: { name: '', users: [ { code: '11111' }, { code: '8797979' }, { code: '4565465' }, { code: '555555' }, { code: '1006' }, { code: '2555' }, ] }, computed: { newUsers: function () { var that = this; return that.users.filter(function (user) { return user.code.toLowerCase().indexOf(that.code.toLowerCase()) !== -1;//当然如果是纯属字就可以不用转换小写了,处于习惯还是加上了 }) } } })
接下来还有一个select的,其实官网有例子,但是我还是毫无保留的拿出来了。
<select v-model="selected" > <option v-for="option in options" v-bind:value="option"> {{ option }} </option> </select> <span>Selected: {{ selected }}</span> new Vue({ el: '.app', data: { selected: '30', options: [ 30,50,70,100 ] }, })