javascript - 在 data() 中将 vuex 状态绑定(bind)到这个?

标签 javascript vue.js vuejs2 vuex

我正在将 vuex 升级到 2.0,想知道它是否可以在数据初始化之前使用 mapstate/getters?

在 Vuex 1.0 中,vuex 状态会在 data() 之前被映射,所以我可以调用 this 然后调用我想要访问的状态

import { mapGetters } from 'vuex'

export default {
  vuex: {
    getters: {
      userSettings: ({ settings }) => settings.userSettings,
    }
  },
  data: function () {
    return {
      sendEmails: this.userSettings.sendEmails
    }
  }
}

但是在 Vuex 2.0 中,我必须执行 this.$store.state.settings.UserSettings.sendEmails

import { mapGetters, mapState } from 'vuex'

export default {
data: function () {
   return {
    sendEmails: this.$store.state.settings.UserSettings.sendEmails
   }
}
computed: {
  ...mapGetters({
    settings: "settings"
  })
}

有没有办法在 data() 之前初始化该状态?我有多个组件在数据初始化中使用状态并且必须调用 this.$store.state?我意识到我可以进行一些解构,但我只是想知道我是否可以避免这种情况。

最佳答案

我会在 mounted 中设置 sendEmails

import { mapGetters, mapState } from 'vuex'

export default {
    data: function () {
       return {
        sendEmails: []
       }
    }

    computed: {
      ...mapGetters({
        settings: "settings"
      })
    },

    mounted: function() {
       if (this.settings.UserSettings){
          this.sendEmails = this.settings.UserSettings.sendEmails
       }
    }
}

关于javascript - 在 data() 中将 vuex 状态绑定(bind)到这个?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/43375447/

相关文章:

javascript - 在 Bootstrap 中向下滚动时菜单消失

javascript - 如何准备一个可解析的 json 对象数组?

javascript - Laravel 5.2 - vue 集成

javascript - 在 vuejs 应用程序中集成 openlayers

javascript - npm run watch 的问题

Javascript:在 For 循环中等待一个(或多个)条件

javascript - AngularJS:提交表单后如何 $setPristine

vue.js - Vue Font-awesome 图标连绑定(bind)

unit-testing - Vuex 中的单元测试抛出 AssertionError 等于 { Object (type, text) }

javascript - 如何重构重复的条件 Vue.js 代码?