vue getters用法

import {
mapGetters
} from 'vuex'

getters应用场景：对数据进行过滤，从state里面抽离出来，
state: {
        count: 0,
        list: [{
                id: "1",
                name: "hucuie",
                ishow: true
            },
            {
                id: "2",
                name: "hucuie",
                ishow: false,
            },
        ]
    },
    getters: {
    //定义一个方法让数据+1
        mount: (state) => {
            return ++state.count

        },
   //过滤数据ishow=true显示出来
        show: state => {
            // return state.list.filter(item =>item.ishow )
            return state.list.filter((item) => {
                return item.ishow
            })

        },
        //得到条件为真的条数
        isshowlength:(state,getters)=>{
            return  getters.show.length
        
        },
        //外部传参返回数据 id等于外部传过来的id
        getid:state=> id =>{
            return state.list.find(item => item.id == id)
        }
        
    },

computed:{

//在页面中使用<p>{{count}}</p>

count(){
this.$store.getters.mount //从而得到值
} ,

//在页面中使用<p>{{count}}</p>

show(){

this.$store.getters.show //从而得到值

},

isshowlength(){
 return this.$store.getters.isshowlength
 },

在页面中使用<p>{{getid(1)}}</p>
 getid(){

//在方法调用
 return this.$store.getters.getid
 }

}

//使用mapGetters可以替换简写
computed:mapGetters(["isshowlength",'getid'])