Question

这是我的vuex商店

export default {
  namespaced: true,

  state: {
    feed: [],
  },

  getters: {
    feed: state => state.feed
  },

  mutations: {
    SET_FEED(state, feed) {
      state.feed = feed
    }
  },

  actions: {
    async fetchNews({commit}) {
      const feed = await fetchNewsFeed()
      commit('SET_FEED', feed)
    }
  }
}

async function fetchNewsFeed() {

  return new Promise((resolve) => {
    setTimeout(() => {
      return resolve([1, 2])
    }, 500)
  })
}

这是我的组件：

<template>
<div>
</div>
</template>

<script>

import { mapGetters, mapActions } from 'vuex';

export default {

name: 'News',

computed: {
    ...mapGetters('News', {
    newsFeed: 'feed'
    }),

    feed() {
    console.log(this.newFeed)
    return this.newsFeed
    }
},

methods: {
    ...mapActions('News', {
    fetchNewsFeed: 'fetchNews'
    })
},

async mounted() {
    await this.fetchNewsFeed()
}
}
</script>

<style scoped lang='scss'>
</style>

提要计算的属性未计算。设置的超时时间结束后，肯定会设置状态。

我已经与观察者进行了这项工作，似乎当我与观察者一起阅读时，计算出的属性会更新。

需要任何帮助

Answer 1

在这里使用...mapState代替...mapGetters更有意义。看看Differences b/n mapState, mapGetters, mapActions, mapMutations in Vuex

商店状态更改时，吸气剂未更新

1 个答案: