函数在 NuxtJs 中只被调用一次

Question

我在我的项目中使用 NuxtJs，我有一个复选框列表，单击每个复选框后，我将一组复选框发送到我的 POST api return 数据。在这里，当我选中第一个复选框时，它 return 是数据。但是当我选中第二个复选框时，它不会 return 数据。我的意思是它只 return 选中了单个复选框上的数据。它适用于普通的 vuejs 但不适用于 nuxtjs

我的代码：

<script>
import axios from "axios";
import uniq from "lodash/uniq";

export default {
  async asyncData({ req, params }) {
    let [storeInfo, feedsInfo] = await Promise.all([
      axios.get(
        process.env.apiURL +
          "/stores/findOne?filter[where][store_name]" +
          "=" +
          params.id
      ),
      axios.post(process.env.apiURL + "feeds/feedsByStores", {
        stores: [params.id]
      })
    ]);
    return {
      stores: storeInfo.data,
      feeds: feedsInfo.data,
      categories: uniq(feedsInfo.data.map(p => p.feed_category))
    };
  },
  data() {
    return {
      checkedCategories: [],
      checkedCategory: false,
      selectedCategories: []
    };
  },
  methods: {
     feedsByCategories: function(categories) {
        console.log(categories);
        axios.post(process.env.apiURL + "feeds/feedsByCategories", {
          categories: [categories]
        }).then((res) => {
            console.log(res);
          })
      },
     categoryChecked: function(category, checked) {
      this.display = "inline";
      if (checked) {
        this.selectedCategories.push(category);
        console.log(this.selectedCategories);
        this.feedsByCategories(this.selectedCategories);
      } else if (!checked) {
        const index = this.selectedCategories.indexOf(category);
        this.selectedCategories.splice(index, 1);
        this.feedsByCategories(this.selectedCategories);
        if (this.selectedCategories == "") {
          this.display = "none";
          this.getFeeds();
        }
      }
      if (!checked && this.selectedCategories.length === 0) {
        this.getFeeds();
      }
    },
    uncheckCategory: function(checkedCategory) {
      this.checkedCategories = this.checkedCategories.filter(
        name => name !== checkedCategory
      );
      const index = this.selectedCategories.indexOf(checkedCategory);
      this.selectedCategories.splice(index, 1);
      this.feedsByCategories(this.selectedCategories);
      if (this.checkedCategories == "") {
        this.display = "none";
        this.getFeeds();
      }
    },
    uncheckallCategories: function(event) {
      this.checkedCategories = [];
      this.display = "none";
      this.search = "";
      this.Search = "";
      this.filteredCategories;
    },
    getFeeds() {
       return this.feeds;
      }
  }
};
</script>

<template>
 <v-layout>
<ul class="list-unstyled scrollbar">
 <li v-for="(feedcategory, index) in categories" :key="feedcategory.id">
  <input type="checkbox" name="category" @change="categoryChecked(feedcategory,$event.target.checked)" 
  :id="index + 1" :value="feedcategory" v-model="checkedCategories">
   {{ feedcategory }}
 </li>
</ul>
 </v-layout>
</template>

Answer 1

我的错别字，

我删除了我的类别数组的括号并且它起作用了：

feedsByCategories: function(categories) {
        console.log(categories);
        axios.post(process.env.apiURL + "feeds/feedsByCategories", {
          categories: categories
        }).then((res) => {
            console.log(res);
          })
      }

函数在 NuxtJs 中只被调用一次

Function only gets called once in NuxtJs

vue.js

nuxt.js

vuetify.js