1、定義了一個side組件。以及vuex對應的side moudle，里面定義了stategettersmutationsactions

<template>
<div>
  <ul>
    <li v-for="item in items">
      <span>公司名稱:{{item.name}}</span>
      <span>聯(lián)系方式:{{item.tel}}</span>
      </li>
  </ul>
</div>
</template>
<script>
import { mapGetters } from "vuex";
export default {
  data() {
    return {
      items: ""
    };
  },
  props: {
    type: {
      type: String
    }
  },
  computed: {
    // ...mapGetters({
    //   companyInfos: "  "
    // }),
    companyInfos() {
      this.items = this.$store.getters.companyInfos;
    }
  },
  //通過傳遞過來的type 執(zhí)行action中的方法來獲取數(shù)據(jù)
  methods: {
    getCompanyInfos() {
      this.$store.dispatch("companyInfos", this.type);
    }
  },
  created() {
    this.getCompanyInfos();
  }
};
</script>

2、在父組件中這樣調用

      <div class="side">
         <vside type="1"></vside>
     </div>    
     <div class="side">
        <vside type="2"></vside>
     </div> 
      <div class="side">
          <vside type="3"></vside>
      </div> 

3、那么問題來了再渲染的，從action傳過來的數(shù)據(jù)只有最后一個。
這樣是可以理解的，因為action提交了mutations，mutation中修改了state中的數(shù)據(jù)，所以在side組件中，computed中 companyInfos數(shù)據(jù)是state中的永遠是一樣的。
但是在data屬性中定義了一個items參數(shù)，每次都會將companyinfos的數(shù)據(jù)賦值給items按道理這樣渲染的數(shù)據(jù)應該不是同樣的數(shù)據(jù)。
4、該怎么樣 讓side組件根據(jù)prop中type的數(shù)值得到不同的數(shù)據(jù)。
5、追加action

/**
 * 調用異步api
 * 獲取company的信息
 */
const actions = {
    companyInfos({ commit, state }, type) {
        return new Promise((resolve, reject) => {
            sideData(type).then(res => {
                const data = res.data
                commit(types.COMPANYINFOS, data)
                resolve(data)
            }).catch(res => {
                reject(res)
            })
        })
    }
}