假設 store 中的state數(shù)據(jù)如下：

state: {
    name: '',                     // 姓名
    headPortrait: '',             // 頭像
    birthday: '',                 // 出生日期
    relationship: '',             // Ta 是你的
    mobilePhone: '',              // 手機號
    certificatesNumber: '',       // 身份證號碼
    isSocialSecurity: '',         // 有無社保 Y/N
    certificates: [               // 證件
      {
        type: '護照',
        name: 'Avery',
        number: ''
      }
    ]
  },

如果頁面中我想直接消費這些數(shù)據(jù)，無需轉換后使用，那么其實可以直接在組件中通過 $store.state.name 等訪問到。但是這樣一來，我就必須在所有地方都使用 $store.state 前綴，如果分了模塊的話，前綴還可能有模塊名，這很長很繁瑣。
對此，可以寫一個 getter, 如
contactInfo: state => state，
那么將該 getter 映射到 computed 屬性，組件中就可以使用 contactInfo.name 之類的訪問數(shù)據(jù)了。然而，每次訪問時又必須寫上 contactInfo 前綴，我仍然覺得這很 repetitive。其實，我很想在組件中直接用 name, headPortrait, ... 這樣的變量。于是，我就需要在computed 屬性中指定所有的字段生成規(guī)則，如下：

computed: {
      name: function() {
        return this.$store.getters.contactInfo.name;
      },
      headPortrait: function() {
        return this.$store.getters.contactInfo.headPortrait;
      },
      birthday: function() {
        return this.$store.getters.contactInfo.birthday;
      }
      // ...
    }

這樣確實實現(xiàn)了我的愿望，不用寫前綴。然而，如果屬性很多，computed屬性中這種形式重復的代碼會很多。通過觀察會發(fā)現(xiàn)，它們有一個共性就是都是從 contactInfo 這個 getter 上面取屬性，映射到一個同名的 computed 屬性上。于是，聯(lián)想到 mapGetters 函數(shù)自動生成對象的做法，我們有理由相信可以寫這么一個函數(shù)，遍歷 contactInfo 這個 getter 上的所有屬性，生成一個對象直接使用，而無需手動添加每一個屬性。

如果你知道 mapGetters 是干什么的話，一定知道它并不能解決我這個問題。但是我這個問題解決起來和 mapGetters 是類似的。我不知道vue 官方怎么沒有提供這樣一個 helper 函數(shù)。

我自己解決這個問題遇到的困難是，無法訪問組件實例，代碼如下：

computed: (function() {
      let o = {};
      let contactInfo = this.$store.getters.contactInfo; // 這個this肯定不是組件實例
      for(k in contactInfo) {
        if (contactInfo.hasOwnProperty(k)) {
          o[k] = () => contactInfo[k];
        }
      }
      return o;
    }()),

所以我想問一下這個問題可以怎么解決，這種情況如何訪問組件實例？