vuex的命名空间有哪些_【uniapp关于vuex的问题】使用vuex的命名空间有页面不渲染的问题...

在使用Vuex的命名空间功能时,遇到在uniapp项目中页面无法渲染的问题,错误提示为`TypeError: Cannot read property 'state' of undefined`。通过查看官方示例并对比代码,发现在组件中使用了`createNamespacedHelpers`创建的映射方法。文章详细介绍了出现此问题的vuex和组件代码,包括`store->index.js`的存储仓库结构和`onShow`、`computed`属性的定义。请求社区开发者帮助复现问题并找出解决办法。
摘要由CSDN通过智能技术生成

首先真机测试是这个问题:

TypeError: Cannot read property 'state' of undefined at D:/%E5%89%8D%E7%AB%AF%E9%A1%B9%E7%9B%AE/youqing_App/node_modules/@dcloudio/vue-cli-plugin-uni/packages/mpvue/index.js:638

表示state找不到,所以看了官方的demo,发现跟我的这个差不多,只是没有用这个namespace命名空间,这个是问题代码;

// vuex

import { createNamespacedHelpers } from "vuex"; // 取对应的模块

const { mapState, mapMutations } = createNamespacedHelpers("index");

// api

import {

userReverse,

getViewAllDay,

getYesNowTime,

getDeskNumber

} from "@/api/index";

export default {

components: {

commonHeader,

commonCustomer,

styleHead

},

onShow() {},

computed: {

...mapState([

"mealId",

"deviceContext",

"deviceTotal",

"choiseCutomer",

"confirm_type",

"money",

"pay_type",

"recive_num",

"contract_num",

"contract_image",

"undertake_type",

"undertake_time",

"undertake_id"

])

vuex代码是这样写的;

store->index.js

/**

index首页下的存储仓库

*/

export default {

namespaced: true,

state: {

// 销售选择客户的信息(id,名称,电话等)

choiseCutomer: {},

// 选择菜单的ID

mealId: 1,

// 选择菜单的备注

mealText: "",

// 设备的json字符串,设备id:设备数量

deviceContext: "",

// 设备的总额

deviceTotal: "",

undertake_id: "", // 如果合作方式为自营必填项

// 承办方式

undertake_type: 0,

undertake_time: "", // 自带/自营 入场时间必填,

// 以下为确认方式

confirm_type: "",

money: "",

pay_type: "",

recive_num: "", // 收款码(确认方式为现金必填)

contract_num: "", // 合同编码(确认方式为合同必填)

contract_image: "", // 合同字符串(确认方式为合同必填)

// 没有看错,没有担保人的选项

},

mutations: {

// 清空所有

deleteAll(state) {

state.mealId = 1;

state.mealText = "";

state.deviceContext = "";

state.deviceTotal = "";

state.undertake_id = "";

state.undertake_type = "";

state.undertake_time = "";

state.confirm_type = "";

state.money = "";

state.pay_type = "";

state.recive_num = "";

state.contract_num = "";

state.contract_image = "";

},

// 保存选择客户信息

saveCustomer(state, info) {

state.choiseCutomer.id = info.id;

state.choiseCutomer.name = info.name;

state.choiseCutomer.tel = info.tel;

},

// 确认方式保存

saveSuretype(state, info) {

state.money = info.money;

state.pay_type = info.pay_type;

state.recive_num = info.recive_num;

state.contract_image = info.contract_image;

state.contract_num = info.contract_num;

state.confirm_type = info.confirm_type;

},

// 承办方式保存

saveUnder(state, info) {

state.undertake_id = info.undertake_id;

state.undertake_type = info.undertake_type;

state.undertake_time = info.undertake_time;

},

// 把设备明细和设备总额保存进去

saveDevice(state, info) {

state.deviceContext = info.deviceContext;

state.deviceTotal = info.deviceTotal;

},

// 保存菜单把ID保存进去

saveMeal(state, info) {

state.mealId = info.mealId;

state.mealText = info.mealText;

}

},

actions: {

saveMeal(context, mealId) {

context.commit("saveMeal", mealId);

}

}

}

求官方人员复现代码,看看编译会不会出现问题;

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值