Vuex Store Object Child返回未定义，parent返回正确。为什么？
根据提供的问答内容，问题描述了在使用Vuex Store对象时，子对象返回undefined，而父对象返回正确的值。下面是对这个问题的完善和全面的答案：
问题原因可能是在Vuex Store对象中，子对象的属性未正确定义或者未正确获取。以下是可能导致这种情况的几个常见原因：
- 子对象属性未正确定义：请确保在Vuex Store中，子对象的属性已经正确定义。可以通过在子对象的模块中使用
state属性来定义子对象的属性。例如：
// 子对象模块
const moduleA = {
state: {
childProperty: 'value'
}
}- 子对象属性未正确获取：请确保在组件中正确获取子对象的属性。可以通过使用
mapState辅助函数来获取子对象的属性。例如：
// 组件中获取子对象属性
import { mapState } from 'vuex'
export default {
computed: {
...mapState('moduleA', ['childProperty'])
}
}- 子对象属性命名冲突：请确保在Vuex Store中，子对象的属性名称没有与其他模块或组件中的属性名称冲突。可以通过在子对象的模块中使用命名空间来避免冲突。例如：
// 子对象模块
const moduleA = {
namespaced: true,
state: {
childProperty: 'value'
}
}- 子对象属性异步获取：如果子对象的属性是通过异步操作获取的，可能会导致在获取之前返回undefined。在这种情况下，可以使用
actions来处理异步操作，并在获取到属性后更新子对象的状态。例如：
// 子对象模块
const moduleA = {
state: {
childProperty: null
},
actions: {
fetchChildProperty({ commit }) {
// 异步获取子对象属性的逻辑
// 获取到属性后，通过commit方法更新子对象的状态
commit('setChildProperty', fetchedValue)
}
},
mutations: {
setChildProperty(state, value) {
state.childProperty = value
}
}
}以上是对问题的可能原因和解决方法的说明。关于Vuex和Vuex相关的概念、分类、优势、应用场景以及腾讯云相关产品和产品介绍链接地址，由于问题要求不能提及特定的云计算品牌商，所以无法提供相关信息。如果需要了解更多关于Vuex的信息，建议参考官方文档或者进行相关的在线搜索。
相关·内容
Description(tl;dr):
当我通过v-model将“对象的对象”从vuex的存储传递到组件时，模型的修改会产生错误。当“对象的对象”传递时，仅为。任何其他类型的东西都没问题。
当我告诉“对象的对象”时，我指的是这样的结构：{'A': {name: 'first'}, 'B': {name: 'second'}}。
工作流与结构化
结构：view (page) -> parent -> child；
查看从存储中获取Object并将其传递给组件(->parrent->child)；
浏览 2提问于2016-08-31得票数 0
回答已采纳
我正在尝试读取/访问我的vuex存储，但是我得到了“无法读取未定义的属性'$store‘的错误，为什么？
这就是我试过的..。
我在一个单独的store.js文件中创建了一个Vuex存储。
import Vuex from "vuex";
import Vue from "vue";
import { Auth } from "aws-amplify";
Vue.use(Vuex);
export const store = new Vuex.Store({
state: {
user: null
},
actio
浏览 0提问于2021-01-30得票数 0
回答已采纳
我有一个导入vuex商店的库
import {store} from "./index"
该index文件有一个常量导出，如下所示
export const store = new Vuex.Store({ ...
在我进行导入的文件中，我想在导入后使用存储中的内容，但store未定义。
如果我将我的商店访问封装在一个setTimeout中，比如
setTimeout(()=>{
// use store normally now..
},0)
它起作用了。
为什么？我猜这并不是Vuex所特有的，但我不知道为什么会这样。
浏览 5提问于2018-03-12得票数 1
在使用vuex模块装饰器时遇到了这样的问题。我想创建一些父模块，这样子模块就可以从它扩展并继承它的action和getter。但是getter不是继承的。
我试过这样做：
我的parent-module.ts
import {Action, getModule, Module, Mutation, VuexModule} from 'vuex-module-decorators';
export class ParentStore extends VuexModule {
public get getterForInherit(): any {
ret
浏览 22提问于2019-11-20得票数 2
所讨论的项目是，简单明了，但为了学习，我将其分解为索引和4个js文件(父文件、子文件、根文件和存储文件)，如果不使用元素中的提交，就无法在子元素中调用增量和减少根方法，或者陷入不良实践或反模式，例如在元素中使用道具或this.$root。
这是我的密码：
index.html:
<div id="app">
<parent></parent>
</div>
root.js:
let vm = new Vue({
el: '#app',
store,
methods:{
浏览 6提问于2020-02-04得票数 0
回答已采纳
2回答
嗨，我对拉拉维尔和瓦埃很陌生。我第一次尝试使用vuex，但不知道为什么。
我安装了vuex，并在app.js中导入了它，如下所示
import Vuex from 'vuex';
Vue.use(Vuex);
我在刀片文件中分别声明vue，所以我尝试在刀片文件中对vuex进行同样的操作。
<script>
const store = new Vuex.Store({
state: {
village: ''
},
mutations: {
chan
浏览 2提问于2020-09-05得票数 0
我以为我把这个弄坏了。我正在尝试从URL查询中获取一个id，例如http://localhost:8080/car?rec140ttKVWJCDr8v，将其赋给一个本地变量，并将其与存储对象中的id进行比较，以提取匹配的节点并将其作为道具发送给子组件。除非我在孩子本身中触发一个webpack重新渲染，否则它永远不会到达孩子那里。它需要在页面刷新时到达那里。
我认为这可能是一个重新渲染的问题，所以我尝试了随机子组件密钥，但这不起作用。我也尝试过使用计算机道具，但也遇到了同样的问题。我觉得我错过了一些简单的东西。
下面是控制台中的渲染顺序。最后一次父更新是在carsObject可用时，但在此之前，
浏览 10提问于2020-05-05得票数 0
3回答
遵循VueMaster课程中的一个简单示例，似乎无法从存储区读取状态。这是我的main.js：
import Vue from 'vue'
import upperFirst from 'lodash/upperFirst'
import camelCase from 'lodash/camelCase'
import App from './App.vue'
import router from './router'
import store from './store'
new Vue({
浏览 0提问于2021-01-05得票数 0
回答已采纳
1回答
我使用类星体框架和vuex作为我的应用程序。父组件使用vuex存储区的数据呈现子组件。子组件是可满足的，如果我在其子组件上按enter键，存储将被更新。但是父组件中的计算属性没有更新。这是我的代码：
parent-component.vue
<template>
<div>
<div v-for="(object, objKey) in objects"
:key="objKey">
<new-comp
:is=object.type
浏览 2提问于2019-01-23得票数 1
1回答
我已经模块化了我的Vuex存储，并且需要子组件能够访问数据/使用与它们的父组件相同的存储。
以下是我尝试过的：
<!-- ParentOne.vue -->
<template>
<div>
<child-component
vuex-store="services/opportunities"
/>
</div>
</template>
<script>
import ChildComponent from '@/components/services/child-c
浏览 3提问于2020-10-09得票数 0
1回答
我不知道为什么这不管用，所以希望你能帮上忙
我所要做的只是通过vuex商店获得一个get请求，而不是像我目前作为学习vue/nuxt的一部分在组件中所做的那样，但是不能让它按如下方式工作，有人能看到我做错了什么吗？
vex商店
import Vuex from "vuex";
import axios from "axios";
const URL = 'MYPATH';
const logStore = () => {
return new Vuex.Store({
state: {
logItems: {}
},
actions
浏览 1提问于2018-06-08得票数 0
回答已采纳
1回答
我将一个对象数组分派到Vuex存储，并尝试使用Vuex中的"getters“获取数据。它返回未定义的。然而，它适用于同一Vuex中的布尔变量。对于数组，它没有给出正确的结果 我正在使用Vuex更新vue组件中的对象数组。 我正在调度对象数组 通过“操作”提交数组 通过“突变”设置和更新值 通过"state“声明数组 最后，从Vue组件中，通过"getters“访问数组 当我使用"getters“进行访问时，我希望Vuex返回对象数组。 商店代码如下所示 export default new Vuex.Store({
state: {
浏览 19提问于2019-09-03得票数 0
回答已采纳
1回答
我第一次在一个“功能范围结构”中使用Vuex商店，并且一直很难追踪我为什么要得到一个[vuex] unknown getter: $_kp/kp - (Vue/Vuex除了引用的错误之外，并没有抛出太多的东西)。
UPDATE：我打开store.subscribeAction()查看是否有更多的信息丢失。这是打印的日志(我没有看到任何有用的，但希望它能对您有所帮助)。
行动类型：$_kp/getKpIndex
行动有效载荷:未定义
当前状态：{ob：观察者} $_kp:对象kp："2“//<- -这就是我想得到的-- "2"！
更新-2：，我现在也在使用V
浏览 0提问于2019-01-22得票数 2
回答已采纳
我创建了一个VueX存储文件，如下所示：
// Import packages
import Vue from 'vue';
import Vuex from 'vuex';
import VuexPersistence from 'vuex-persist';
// Import models
import Problem from './models/Problem';
// Create localStorage persistence object
const vuexLocal = new VuexPersisten
浏览 3提问于2020-07-26得票数 0
回答已采纳
// nuxt vuex module
export const state = () => ({
test : '',
});
// state should be a method that returns an object in store/index.js
export const state = {
test : '',
};
// pure vue or classic mode
const store = new Vuex.Store({
state: {
count: 0
},
})
为什么在模块模式中使用vu
浏览 2提问于2020-01-23得票数 2
回答已采纳
我的商店/index.js是：
import Vue from 'vue'
import Vuex from 'vuex'
Vue.use(Vuex)
export default
new Vuex.Store({
state: {
name: 'Alicia Vikander',
age: 20,
dob: '20/08/1990'
},
mutations: {
updateName(state, name) => {
state.name = name
}
浏览 0提问于2018-08-28得票数 3
1回答
我正在使用Vuex/Axios向API发出GET请求。当组件挂载时，我向Vuex存储分派一个操作，并发出Axios GET请求。在Vuex操作中，Axios GET请求按预期返回响应，但组件内部的响应返回未定义。我做错了什么？
axios/index.js
import axios from 'axios';
const API_URL = 'http://localhost:3000/api/v1/';
const plainAxiosInstance = axios.create({
baseURL: API_URL,
withCredent
浏览 26提问于2019-11-07得票数 1
回答已采纳
我几乎已经尝试了我能想到的所有方法，但我无法正确地挂载/浅挂载我的vue组件以进行正确的测试。每次我对包装器执行console.log操作时，我都会得到以下打印输出： VueWrapper {
isFunctionalComponent: undefined,
_emitted: [Object: null prototype] {},
_emittedByOrder: []
} 此问题与此处提出的问题类似： Vue-test-utils wrapper undefined 我用的是Vuetify，Vuex和Vue Router。我的test.spec.ts如下： import
浏览 53提问于2021-02-24得票数 0
回答已采纳
我和Webpack一起用Vuejs。
这里是store.js：
import Vuex from "vuex";
export default new Vuex.Store({
state: {
count : 0
},
mutations: {
increment (state) {
state.count++
}
}
});
这是我的app.js：
"use strict";
import Vue from 'vue';
window
浏览 0提问于2018-07-09得票数 0
回答已采纳
3回答
目前我使用的是Vue CLI version^3.0.0和Vuex^3.6.0，但是当我想使用Vue.use( Vuex )时。它说在浏览器中不能读取未定义的使用。
代码：
main.js
import App from './App.vue'
import store from './store'
new Vue({
store,
render: h => h(App)
}).$mount('#app')
Store.js：
import Vue from 'vue';
import Vuex from
浏览 37提问于2021-02-16得票数 0
回答已采纳
7回答
就像在main.js中一样，我试图从一个助手函数文件中访问我的商店：
import store from '../store'
let auth = store.getters.config.urls.auth
但是它记录了一个错误：
未定义的TypeError:无法读取未定义的属性“getter”。
我试过了
this.$store.getters.config.urls.auth
同样的结果。
商店：
//Vuex
import Vue from 'vue'
import Vuex from 'vuex'
Vue.use(Vuex
浏览 6提问于2017-12-14得票数 49
回答已采纳
组件本身在页面上工作，没有错误。
故事书也是如此，唯一的问题是单元测试。
import { mount } from '../../vue';
import { createLocalVue } from '@vue/test-utils';
import Vuex from 'vuex';
import SessionGymChart from '@/components/SessionGymChart.vue';
const localVue = createLocalVue();
localVue.use(Vuex);
浏览 1提问于2022-09-02得票数 0
1回答
我有一个Vue Webpack应用与Vuex (我是新手，来自安博世界)。目前，我已经设置了使用vue-resource的两个文件，如下所示：
/src/store/api.js
import Vue from 'vue';
import { store } from './store';
export default {
get(url, request) {
return Vue.http
.get(store.state.apiBaseUrl + url, request)
.then(response => P
浏览 1提问于2018-01-29得票数 16
回答已采纳
在vue组件中获取未定义的response.data console.log(this.$store.getters.getData)。 但是，我可以使用以下语句console.log(resp.data)来获取response.data 我在成功变异中尝试过console.log(data)，但它仍然返回未定义的结果。 login.vue login: function() {
let data = this.$store
.dispatch("login", data)
.then((resp) =>
浏览 70提问于2019-09-30得票数 2
回答已采纳
我正在尝试将从Firebase返回的accessToken存储到我的Vue项目中的Vuex存储中，当我运行代码时，我得到了以下错误：
未捕获的TypeError:无法读取未定义的属性“”$store“”
它看起来在下面的代码中没有拾取store.js，你知道为什么会这样吗？
谢谢
Login.vue
mounted: function() {
Firebase.auth.onAuthStateChanged( user => {
if (user) {
user.getIdToken().then(function(idToken) {
浏览 5提问于2020-05-24得票数 0
1回答
编辑：这个问题非常混乱，所以我基本上用相同的代码示例和相同的场景重写它。
当从服务器发送401错误时，我尝试从拦截器发送.commit到我的vuex存储：
import axios from 'axios';
import { store } from '../store/store';
export default function execute() {
axios.interceptors.request.use(function(config) {
const token = store.state.token;
浏览 0提问于2018-04-03得票数 6
回答已采纳
我对操纵道具的正确顺序有一些疑问，用vue和vuex计算和创建道具。
我有以下代码
<script>
import { mapGetters } from 'vuex'
export default {
data () {
return {}
},
props: ['id'],
methods: {
},
computed: {
...mapGetters({
semestre: 'semestre/show/item'
})
浏览 2提问于2017-12-15得票数 0
回答已采纳
当我试图访问随机组件中的vuex存储时，将返回未定义的。然而，我把商店注入我的Vue对象。有人知道怎么解决这个问题吗？我可以手动将存储对象导入每个组件，但这并不是很干净.我的文件看起来是这样的：
main.js
import Vue from 'vue'
import VueResource from 'vue-resource'
import VueRouter from 'vue-router'
import VueI18n from 'vue-i18n'
import routes from './config/
浏览 4提问于2017-03-24得票数 0
回答已采纳
2回答
Uncaught :不能使用' in‘操作符在未定义的中搜索’用户‘我不能理解这一行：use 'in' operator to search for 'USERS'，还有为什么是undefined？
我不明白这些错误，请向我解释。
My ：
export default new Vuex.Store({
state: {
users: []
},
actions: {
GET_USERS_FROM_API({commit}) {
return axios('http://localhost:3000/
浏览 5提问于2021-01-11得票数 3
1回答
我试图在Vuex存储中查询一个数组，其中product_id等于一个动态值，如下面的代码所示，但它返回未定义的值。
const store = new Vuex.Store({
state: {
products: {},
},
getters: {
getProductById:(state) => (id) => {
return state.products.find(product => product.data.product_id == id)
},
}
}
浏览 1提问于2021-06-29得票数 1
1回答
在/store/index.js中，我有：
import Vue from "vue";
import Vuex from "vuex";
import auth from "./modules/auth";
然后在/store/modules/auth.js中有：
export const actions = {
login({ commit, dispatch }, payload) {
...
}
}
但是，当尝试通过执行dispatch("auth/login", {})从任何组件分派登录()操作时，我会得
浏览 2提问于2019-12-03得票数 0
我正在尝试制作一个简单的应用程序来显示并保存您的收藏(让我们轻松地将它们称为"object")。我想这样做:从vuex获得最喜欢，在可能的收藏列表中找到最喜欢的，管理我的最爱。
名称值是正确的，我已经知道vuex状态。Elenco是一个由JSON获得的数组，它可以工作，因为我在v-for和其他两个函数中使用它(没有使用forEach函数)。if语句运行良好，否则它将不会显示第一个"i“。
let name = this.$store.state.favTime.id;
console.log(name);
Elenco.forEach(element => {
浏览 0提问于2019-02-04得票数 1
回答已采纳
试图在组件中使用Vuex状态。
这样做很好：
main.js
const store = new Vuex.Store({
state: {
counter: 1
},
mutations: {
increment(state) {
state.counter++
}
}
})
new Vue({
store,
render: h => h(App)
}).$mount('#app')
内部组件：
<span>{{this.$store.state.test}}</span>
当我试图
浏览 0提问于2018-09-18得票数 0
回答已采纳
1回答
当我试图加载页面时，它显示了错误"TypeError:无法读取未定义的属性‘状态’“。根据文档，我试过这辆没有装载的巴士。
<template>
<div>
</div>
</template>
<script>
import { store } from '@/components/tenant/store/store'
import Vue from 'vue'
export default {
store:store,
data: () => {
return {
}
}
浏览 1提问于2018-10-10得票数 0
回答已采纳
0回答
我正在尝试从main.js文件访问我的vue.js应用程序中的应用商店。但是由于某些原因，当我尝试使用商店时，它是undefined。下面是我的代码：
main.js
import { store } from './store/store'
router.beforeEach((to, from, next) => {
if (to.meta.requiresAuth && !store.getters.isLoggedIn) {
next({ path: '/' })
} else if (to.path === &#
浏览 0提问于2018-07-15得票数 2
回答已采纳
在我的App.vue组件中，我有：
mounted () {
this.$store.dispatch('switchSideNav', false)
...
console.log('COOKIE: ', this.$store.state('cookieAgreement'))
if (!this.$store.state('cookieAgreement')
.....
这引发了一个错误：
Error in mounted hook: "TypeError: this.$store.
浏览 3提问于2018-06-05得票数 2
回答已采纳
我想将Vuex突变设置如下：
export default {
props: {
store: String
},
methods: {
...mapMutations({
changeModel: `${this.store}/changeModel`
})
}
}
但我发现了一个错误：
未定义的TypeError:无法读取未定义的属性“存储”
如何正确使用模块突变名内的道具？
我想要映射this.$store.commit('form1/changeModel')
浏览 0提问于2018-08-29得票数 11
回答已采纳
尝试1
main.js
import { createApp } from 'vue'
import { store } from './store/store'
import App from './App.vue'
Vue.config.productionTip = false
const app = createApp(App)
app.use(store)
app.mount('#app')
store.js
import Vuex from 'vuex'
import Vue from '
浏览 1提问于2020-12-16得票数 3
我认为我理解了将初始状态数据从Vuex加载到组件的本地数据的正确方法，但是为什么这给了我“vuex不会在突变处理程序之外突变vuex存储状态”。错误！我正在使用一个突变处理程序！ 我希望我的组件数据一开始是空的，除非从某个页面返回(然后它应该从Vuex中提取一些值)。 该组件在一堆复选框上使用v-model=“selected”。然后我有以下几点： // Template
<grid-leaders
v-if="selected.regions.length"
v-model="selected"
/>
// Script
exp
浏览 12提问于2020-10-16得票数 1
当我用vuex项目运行我的vue时，我得到了下面的错误。
Vue警告:呈现中的错误："TypeError:未定义不是对象(计算'this.$store.state')“
在我的项目中，我创建了vuex/store.js
import Vue from 'vue';
import Vuex from 'vuex';
Vue.use(Vuex);
export const store = new Vuex.Store({
state:{
user_data: null,
is_login: false
浏览 2提问于2018-05-17得票数 0
回答已采纳
3回答
我正在努力学习Vuex和制作认证模块。我正在学习一些教程，当我想要在路由器中使用store时，我得到了这一点。我在路由器index.js的顶部导入我的存储，但是我猜它不是在导入我的存储，因为我无法访问，例如getters (未定义)。
Store在vue组件中运行良好。为什么会发生这种情况？是不是因为创建路由器时store没有正确初始化？根据教程，它工作得很好。
路由器/index.js
import Vue from 'vue'
import VueRouter from 'vue-router'
import routes from './route
浏览 2提问于2019-11-12得票数 2
我试图用xmltodict生成XML。为此，我需要基于OrderedDict生成结构。我在第一次执行".xml()“方法时得到了预期的行为，但是当我第二次执行时，我得到了第二次添加子元素。
from collections import OrderedDict
import xmltodict
class XMLObject(object):
__ns__ = ''
def __init__(self, parent=None, **kwargs):
self.parent = None
if parent:
浏览 0提问于2014-02-10得票数 2
回答已采纳
我试过以下几种方法。请注意parent.vue中的注释行，它甚至没有为我提交新的状态。然而，也许有人能引导我找到一个更好的解决方案，解决由多个组件共享的全局状态？
main.js
import { createApp } from 'vue'
import App from './App.vue'
import { createStore } from 'vuex'
const app = createApp(App);
export const store = createStore({
state: {
textPr
浏览 0提问于2020-11-12得票数 1
回答已采纳
我有一个新的vue-cli webpack项目使用Vuex。我在store.js中初始化了我的Vuex商店，如下所示：
import Vue from "vue";
import Vuex from "vuex";
Vue.use(Vuex);
const store = new Vuex.Store({
state: {}
});
export default store;
在我的App.vue中，我正在从'./store.js'导入存储，它工作得很好，但this.$store未定义。我遗漏了什么？
这是我的App.vue
<s
浏览 1提问于2018-06-14得票数 1
2回答
在我的store中，我需要同时拥有当前周(常量)和最初等于当前周的变量，这些变量可能会因突变而改变：
export default new Vuex.Store({
state: {
thisWeek: moment().startOf('isoWeek'),
currentWeek: thisWeek
}
});
我得到了
未定义thisWeek
但如何解决这个问题呢？
(奖金:在Vuex中没有区分变量和常量的方法吗？)
浏览 2提问于2018-09-25得票数 1
回答已采纳
1回答
如何将值从显示器传递到变体- Vue？
他返回是一个错误，表示函数不存在。
我哪里错了？
谢谢你们
import Vue from 'vue'
import Vuex from 'vuex'
import disponivel from './module-disponivel'
Vue.use(Vuex)
export default function () {
const Store = new Vuex.Store({
modules: {
disponivel
}
)],
})
re
浏览 1提问于2019-05-25得票数 0
回答已采纳
无法读取未定义(读取“use”) vuex的属性
import Vue from 'vue'
import Vuex from 'vuex'
import post from './modules/post'
Vue.use(Vuex)
export default new Vuex.Store({
modules: {
post
}
})
浏览 10提问于2022-05-07得票数 0
在将Vuex添加到我的项目之后，我无法在任何组件中访问这个.$store。错误信息是
TypeError：_this.$store未定义
我已经看过很多问题，试图解决这个问题，但据我所知，我做的一切都是正确的。有人能帮忙吗？我正在使用vue-cli webpack作为我的项目基础。
main.js：
import Vue from 'vue';
import resource from 'vue-resource';
import router from './router';
import store from './store
浏览 0提问于2018-02-15得票数 6
回答已采纳
我目前正在使用Nuxt，我使用axios在我的应用程序中创建了一个中央ApiClient。
services/apiClient.js
import axios from "axios";
import store from '../store/index';
const token = () => {
return store().getters.getToken;
};
const axiosClient = axios.create({
baseURL: "this-is-a-url",
headers: {
浏览 0提问于2019-03-24得票数 1
1回答
我们使用vuejs，typescript，vuex和jest。我们目前正在使用test-utils来模拟商店。
但我找不到如何模拟对此的调用.$parent.$on
这是我们的一个组件(非常简单)：
AnalysisList.ts：
import Component from 'vue-class-component'
import {Getter} from 'vuex-class'
import {UserVO} from '@/valueObjects/UserVO'
import {Vue} from 'vue-property-
浏览 4提问于2018-07-25得票数 0
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
实时音视频
即时通信 IM活动推荐
腾讯云开发者
