2017-04-12 366 views
1

我将vuex升级到2.0,并想知道在数据初始化之前它是否可能使用mapstate/getters?将vuex状态绑定到data()中?

在Vuex 1.0中,vuex状态将数据之前映射()那样的话我可以叫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?我意识到我可以做一些解构,但我只是想知道我能否避免这种情况。

+0

'sendEmails'应该是一个计算的属性,可以最终为它创建的吸气剂(在您的商店)。 – soju

+0

@soju你能解释为什么它必须是一个计算属性? –

+1

您是否阅读过此文件:https://vuex.vuejs.org/en/state.html#getting-vuex-state-into-vue-components? – soju

回答

2

我会成立sendEmailsmounted

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 
     } 
    } 
}