Vue 3 mapGetters 问题 multiple getters 不工作

Question

我的吸气剂

const state = {
    pakets: [
        { id: 1, paketname: "Simple", price: "5" },
        { id: 2, paketname: "Silver", price: "10" },
        { id: 3, paketname: "Gold", price: "15" },
        { id: 4, paketname: "Platin", price: "25" },
    ],
    basket:[],
}

 const getters = {
   getBaskets(state){
     return state.basket
   },
   getTotal(state){
     let total = 0;
     state.basket.forEach(x=> this.total += 1 * x.price)
     return total;
   }
 }

我的组件

<script>
import { mapGetters } from "vuex";
export default {
  computed:{
    ...mapGetters([
        'getBaskets',
        'getTotal'
    ]),
  },
};
</script>

大家好我在自己的项目中写了一个篮子，但是我想在这个基础上计算总数。 mapgetter 只有在接收到 1 个 getter 时才起作用，但是当有 2 个或更多时它不起作用，我无法找出可能是什么原因。谢谢

Answer 1

这样试试：

const getters = {
  getBaskets: (state) => state.basket,
  getTotal: (state) => state.basket.reduce((acc, x) => acc += Number(x.price), 0)
}

Vue 3 mapGetters 问题 multiple getters 不工作

Vue 3 mapGetters problem mutliple getters not working

javascript

vue.js

vuex

vuejs3