Vuex 中，使用modules时，不使用命名空间

fafa.js文件

import * as fafaApi from '@/api/fafa'

const fafa = {
  state: {
    newOrderNum: 9 // 新订单数量
  },

  mutations: {
    SET_NEWORDERNUM: (state, num) => {
      state.newOrderNum += num
    }
  },

  actions: {
    // 获取新订单数量的接口
    GetNewOrderNum({ commit, state }, params) {
      // return new Promise((resolve, reject) => {
      //   fafaApi
      //     .getNewOrderNum(params)
      //     .then(res => {
      //       console.log('res=', res)
      //       // commit('SET_NEWORDERNUM', res.data.num)
      //     })
      //     .catch(err => {
      //       reject(err)
      //     })
      // })
    }
  }
}

export default fafa

Vuex的index.js文件

import fafa from './modules/fafa'

export default new Vuex.Store({
  modules: {
    fafa, // 将 fafa 模块添加到 modules 中
  },
  state: {},
  mutations: {},
  actions: {},
  getters: {},
})

我们的组件

import { mapState } from 'vuex'

export default {
  computed: {
    ...mapState({
      newOrderNum: state => state.fafa.newOrderNum
    })
  },
  // 其他组件选项...
}

在上述代码中，我们使用了对象语法来映射 newOrderNum 变量。我们指定了一个计算属性 newOrderNum，并使用箭头函数来返回 state.fafa.newOrderNum 的值。

这样，newOrderNum 变量就会被正确映射到组件中，并可以在模板中使用了。