getters是用来处理state里的数据的
getters传递一个值state
例子:
store.js
import Vue from 'vue' import Vuex from 'vuex' Vue.use(Vuex) export const store = new Vuex.Store({ state:{ prod:[ {name:"zs",age:12}, {name:"ls",age:13}, {name:"ww",age:14}, ] }, getters:{ getValue(state){ var item = state.prod.map((ele,index)=>{ return { name:ele.name+"__技术部", age:ele.age+10 } }) return item ; } } })
Home.vue
<template> <div> <table> <tr> <th>姓名</th> <th>年龄</th> </tr> <tr v-for="(item,i) in getValue"> <td>{{item.name}}</td> <td>{{item.age}}</td> </tr> </table> <hr> <table> <tr> <th>姓名</th> <th>年龄</th> </tr> <tr v-for="(item,i) in getItem"> <td>{{item.name}}</td> <td>{{item.age}}</td> </tr> </table> </div> </template> <script> export default { name: "Home", data () { return { }; }, computed:{ getValue(){ return this.$store.state.prod; }, getItem(){ return this.$store.getters.getValue } } } </script> <style lang="css" scoped> </style>
结果: