【问题标题】:Can't access specific state property in Vuex store无法访问 Vuex 商店中的特定状态属性
【发布时间】:2021-02-16 16:14:56
【问题描述】:

我的商店的状态对象有 3 个属性:user_idfavoritesposted_states

这是我的状态对象:

state: {
        favorites: [],
        user_id: null,
        posted_states: []
  
      },

我有一个查询我的数据库的操作,并将user_id 属性设置为返回值。 问题是,在另一个操作中,当我尝试访问 user_id 属性时,它总是返回 null。我注意到的一些奇怪的事情是,如果我尝试记录实际的 state 变量,它会显示我提到的 3 个属性,而 user_id 属性会正确显示 id,并且不为空。

如您所见,直接访问状态总是返回 null。更奇怪的是,如果我尝试通过其他操作访问 state.user_id,它会返回正确的 user_id 并且不为空。

这是我得到user_id的操作:

get_current_user_id ({commit, state, dispatch})
        {
          Nova.request().get('/nova-vendor/favorites-tool/get_current_user_id')
          .then((response) => {
              // handle success
              if (response.data) {
                commit('set_user_id', response.data)
              }
  
          })

这是我设置user_id的突变

set_user_id(state, payload) {
          state.user_id = payload
        },

老实说,我认为问题不在于突变或动作本身。我也尝试过完全跳过突变并直接设置它,但没有奏效。我尝试使用 getter 而不是直接访问它,并且还尝试将我的组件分成一个父子组件,在该父子组件中,父组件分派设置 user_id 的操作,子组件分派需要 user_id 的操作,假设这会如果存在竞争条件,则消除它(但是,我也不认为这是竞争条件。)

【问题讨论】:

  • 您是否尝试过使用getters
  • 我有,我忘了在我的帖子中添加。
  • 您在其他什么操作中尝试访问 user_id 以及何时调用该操作?编辑:我建议在您调用操作以从后端获取 user_id 以及您尝试访问 user_id 的操作时键入调试器。我猜您是在获得后端响应之前尝试访问它
  • 您能否展示您提到的检索方法的示例代码 - 一种成功返回 user_id,另一种失败?
  • 我没有“检索”的特定代码,我有一个操作应该设置一次 user_id 的状态。 “成功/失败”取决于尝试访问状态的操作。

标签: javascript vue.js vuex


【解决方案1】:

只是发布这个以防有人遇到这个问题 - 这个问题确实是一个竞争条件。我通过编写将user_id 提交为承诺的操作来修复它,然后更改要求user_id 仅在承诺解决时才调度的第二个操作,遵循以下评论:https://stackoverflow.com/a/40167499/12462293

【讨论】:

    猜你喜欢
    • 2020-05-22
    • 2020-02-05
    • 2017-05-28
    • 2018-05-19
    • 1970-01-01
    • 2021-09-24
    • 2021-09-23
    • 2017-07-06
    • 2021-04-10
    相关资源
    最近更新 更多