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'])