vue-過濾器實現數據的轉換

將后端傳來的數據轉為要展示的數據：

{name:'手機',state:'0'},
{name:'電腦',state:'1'},
{name:'包包',state:'2'},
{name:'衣服',state:'1'}

將state對應的值轉為要展示的值

window.onload = function(){
    new Vue({
        el:"#my",
        data:{
            name:'', //添加的表單值
            lists:[
                {name:'手機',state:'0'},
                {name:'電腦',state:'1'},
                {name:'包包',state:'2'},
                {name:'衣服',state:'1'}
            ]
        },
        methods:{
            add:function(){  //添加
                //判斷是否為空
                if(!this.name) return;
                this.lists.unshift({name:this.name,state:'0'});
                this.name = '';  //清除
            },
            del:function(i){  //刪除
                this.lists.splice(i,1);  //i表示位置  1個數
            }
        },
        filters:{ //過濾器
            stateFilter:function(d){   //{{list.state | stateFilter}}    d=list.state 
                // if(d){
                //     return '已采購'
                // }else {
                //     return '未采購'
                // }
                switch(d){
                    case '0':
                        return '未采購';
                    case '1':
                        return '采購中';
                    case '2':
                        return '已采購';
                    default:
                        return d;
                }
            }
        }
    })
}