Javascript 从Vue.js 2中的计算属性中的推送到数组

我希望从Vue.js 2中的computed属性中推送到一个数组，Vue正在Laravel中使用，我得到以下响应

createSelection:“（评估期间出错）”

正在使用以下代码：

<template>
  <div>
    <div>Credits carried through: {{ credits }}</div>
    <div v-for="meal in meals">
      {{meal}}
      <input :id="meal" :name="meal" v-model.number="creditsPerMeal[meal]" type="number">
    </div>
    <div>
      Credits used: {{creditsSum}}/{{credits}}
    </div>
  </div>
</template>

<script>
  export default {

    mounted() {
        console.log('Component ready.');

        console.log(JSON.parse(this.f));

    },

    props: ['f','c'],

    name: 'credits',
    data: function () {
     var meals = JSON.parse(this.f)

     var creditsPerMeal = {}
     for (var i = 0; i < meals.length; i++) {
       creditsPerMeal[meals[i]] = 0
     }

     var createSelection = []


      return {
        credits: this.c,
        meals,
        creditsPerMeal
      }
    },

    computed: {
      creditsSum () {
        return Object.values(this.creditsPerMeal).reduce((a, b) => a + b, 0)
      },

      createSelection: function (){
        for (var i = 0; i < meals.length; i++) {
           createSelection.push({
              food: meals[i],
              quantity: creditsPerMeal[meals[i]]
            })
          }
      }
    }
  }
</script>

结转学分：{{Credits}
{{膳食}
使用的信用：{{creditsSum}/{{Credits}
导出默认值{
安装的（）{
log（'组件就绪'）；
log（JSON.parse（this.f））；
},
道具：['f'，'c']，
名称：'学分'，
数据：函数（）{
var=JSON.parse（this.f）
var credit精子={}
对于（变量i=0；i<0.length；i++）{
Credit精子[膳食[i]]=0
}
var createSelection=[]
返回{
学分：本课程，
餐，
精囊
}
},
计算：{
creditsSum（）{
返回Object.values（this.credits）.reduce（（a，b）=>a+b，0）
},
createSelection:函数（）{
对于（变量i=0；i<0.length；i++）{
createSelection.push({
食物:膳食,，
数量：精[餐[i]]
})
}
}
}
}

Computed方法应该返回一些东西，实际上它们不应该做任何事情，只是计算一些东西并返回。您的计算方法根本没有返回。 首先，将推送逻辑移动到方法：

   computed: {
      creditsSum () {
        return Object.values(this.creditsPerMeal).reduce((a, b) => a + b, 0)
      },
   },
   methods: {
      createSelection (){
          for (var i = 0; i < meals.length; i++) {
              createSelection.push({
                 food: meals[i],
                 quantity: creditsPerMeal[meals[i]]
              })
          }
      }
   }

计算：{
creditsSum（）{
返回Object.values（this.credits）.reduce（（a，b）=>a+b，0）
},
},
方法：{
createSelection（）{
对于（变量i=0；i<0.length；i++）{
createSelection.push({
食物:膳食,，
数量：精[餐[i]]
})
}
}
}

---

另外，评估过程中出现的

错误

不是问题的描述，看起来也不像Vue问题，您可以提供更详细的错误吗？

感谢您的回复，是的，这是一个Vue错误，因为它只显示在Vue开发工具中，而不是控制台中。我会试试你的代码。所以补充说，在，刚才需要调用这个方法的时候，最好的方法是什么？也许看？你需要在哪里调用这个方法？我看不到问题代码中的

createSelection

标识符调用。顺便说一句，

data

函数执行一些操作，我建议只返回dic，并在

created

hook中执行变量初始化，这看起来也很奇怪。另外，

createSelection

数组应该位于数据内部，当您使用它时，您应该像

this.createSelection

一样引用它，还有一件事-将方法（或计算方法）命名为数据变量不是一个好主意。