我如何从javascript中的每个循环返回我的每个值

Question

我正在将Bootstrap vue表与内容丰富的API结合使用，并且可以对我的代码使用一些帮助。我正在尝试使用for循环来遍历数组并获取属性值。 console.info（episodes）; call打印出var情节的每个迭代，但是现在我如何将其绑定到变量情节。使用return只会返回一个结果，即使在每个循环的之外。我们非常感谢您对其他实现的任何帮助或建议。以下是完整模板。

<template>
<div>
<h1>Bootstrap Table</h1>
<b-table striped responsive hover :items="episodes" :fields="fields"></b-table>
</div>
</template>
<style>
</style>
<script>
import axios from 'axios'
// Config
import config from 'config';
// Vuex
import store from 'store';
import {
  mapGetters,
  mapActions
} from 'vuex';
// Services
import {
  formatEntry
} from 'services/contentful';
// Models
import {
  entryTypes
} from 'models/contentful';
// UI
import UiEntry from 'ui/Entry';
import UiLatestEntries from 'ui/LatestEntries';
const contentful = require('contentful')
const client = contentful.createClient({
  space: 'xxxx',
  environment: 'staging', // defaults to 'master' if not set
  accessToken: 'xxxx'
})
export default {
  name: 'contentful-table',
  data() {
    return {
      fields: [{
          key: 'category',
          sortable: true
        },
        {
          key: 'episode_name',
          sortable: true
        },
        {
          key: 'episode_acronym',
          sortable: true
        },
        {
          key: 'version',
          sortable: true
        }
      ],
      episodes: []
    }
  },
  mounted() {
    return Promise.all([
        // fetch the owner of the blog
        client.getEntries({
          content_type: 'entryWebinar',
          select: 'fields.title,fields.description,fields.body,fields.splash'
        })
      ]).then(response => {
        // console.info(response[0].items);
        return response[0].items
      })
      .then((response) => {
        this.episodes = function() {
          var arrayLength = response.length;
          var episodes = [];
          for (let i = 0; i < arrayLength; i++) {
            // console.info(response[i].fields.title + response[i].fields.splash + response[i].fields.description + response[i].fields.body );
            var episodes = [{
              category: response[i].fields.title,
              episode_name: response[i].fields.splash,
              episode_acronym: response[i].fields.description,
              version: response[i].fields.body
            }]
            // episodes.forEach(category => episodes.push(category));
            console.info(episodes);
          }
          return episodes;
        }
      })
      .catch(console.error)
  },
}

</script>

Answer 1

您可以在响应数组上使用map方法来返回所有元素。

在当前示例中，您一直在重置episodes变量，而不是实际要设置的push()。 map方法仍然是解决问题的一种更优雅的方法。

this.episodes = response.map((item) => {
    return {
        category: item.fields.title,
        episode_name: items.fields.splash,
        episode_acronym: item.fields.description,
        version: item.fields.body
    }
})

您可以先更新last，然后与下面的last匹配

]).then(response => {
    return response[0].items;
})
.then((response) => {
    this.episodes = response.map((item) => {
        return {
            category: item.fields.title,
            episode_name: items.fields.splash,
            episode_acronym: item.fields.description,
            version: item.fields.body
        };
    });
})
.catch(console.error)

您确实有不必要的第二个then，但我把它留在那里，以便您可以看到我要替换的内容。