很多页面或者组件要调用vuex的state，怎么写最好啊？

Question

store我使用了2个模块，/store/index.js如下：

import Vue from 'vue';
import Vuex from 'vuex';
import app from './modules/app';
import user from './modules/user';

Vue.use(Vuex);const store = new Vuex.Store({
  modules: {
    app,
    user
  }
});export default store

/store/modules/app.js如下：

const app = {
  state: {   
   skills: null //另外还有很多状态，在此例举一个
  },  
  mutations: {},  
  actions: {},  
  getters:{}}
  export default app;

现在我是在所有页面或者组件的data里面直接引用状态，如

export default {
  data() {
    skills: this.$store.state.app.skills,
  }
}

这样可以用，但是合理么？

我试了一下在页面使用

import { mapGetters } from 'vuex'export default {
  computed: {
    ...mapGetters(['skills']),
  },
}

这样好像比较符合规范，但是难道需要把states的所有属性都在getters全部写一次return？感觉很冗余啊？
特来请教，不胜感激。

Answer 1

使用mapGetters！

Answer 2

用mapState？