从 json 获取数据以填充数据表答案

【问题标题】：getting data from json in order to fill a datatable从 json 获取数据以填充数据表
【发布时间】：2020-05-31 02:51:48
【问题描述】：

开发人员好日子......我正在尝试使用已经通过 fetch 获取并先前存储在我的 vuex 实例中的变量中并且现在在我的小程序中称为计算属性的信息来动态填充数据表说我有这个：

<script>
import { mapActions, mapGetters } from "vuex";
export default {
  name: "Games",
  data() {
    return {
      search: "",
      headers:[
             {text:'Game#', value:'Game#'},
             {text:'Players in Game',value:'Players inGame'},
             {text:'Permissions',value:'Permissions'},
             {text:'Results',value:'Results'},

      ],

    };
  },
  components: {
  },
  props: ["gameid"],
  methods: {
    ...mapActions(["fetchingJsonEvents", "joinToGame","logOut", "createGame"]),

  },
  computed: {
    ...mapGetters(["getGamesAll", "getUserLogged"]),
    getGamesAll(){
       return this.$store.getters.getGamesAll.games-------->here is where the json is stored
    }
  },
  created() {
    this.fetchingJsonEvents();
  }
};
</script>

我的 html 标签调用了这个计算，其他的都是这样的：

<v-data-table :search="search" :headers="headers" v-bind:items="getGamesAll">
    <template>
          <tbody>
            <tr v-for="(general, index) in getGamesAll.games" v-bind:key="index">
              <td>Game {{general.id}}:</td>

              <td>xxxxxxxx</td>
              <td>xxxxxxxx</td>
          </tbody>
     </template>
 </v-data-table>

但是该表没有显示任何结果，它与 v-simple-table 一起使用，但是一旦我尝试以这种方式进行操作，它就不会.... 任何建议......提前谢谢

【问题讨论】：

标签： javascript json vue.js vuex v-data-table

【解决方案1】：

这是不必要的：

getGamesAll(){
 return this.$store.getters.getGamesAll.games
}

因为您已经使用mapGetters：

...mapGetters(["getGamesAll", "getUserLogged"]),

如果您的 getter getGamesAll 有数据，那么这应该可以正常工作：

<tr v-for="(general, index) in getGamesAll.games" v-bind:key="index">

【讨论】：