Javascript 从Vue.js 2中的方法中推送到数组

我希望从Vue.js 2中的一个方法中推送到一个数组，Vue正在Laravel中使用，我得到以下响应。有没有更好的办法

未捕获的TypeError:_vm.createSelection不是函数

我想创造的是：

selection[
{food: Chicken, quantity: 3},
{food: Rice, quantity: 2},
{food: Pasta, quantity: 1}
];

正在使用以下代码：

<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" v-on:input="createSelection()">
    </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,
        createSelection: [],
        creditsPerMeal
      }
    },
    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]]
               })
           }
       }
     }
  }
</script>

更新方法

---

您的数据方法正在创建一个名为createSelection的数组属性，该属性可能会隐藏/替换您正在定义的createSelection方法。确保为所有成员使用唯一的名称。

作为猜测：this.data.createSelection.push。。。？除了createSelection方法之外，您如何从不同的函数作用域访问局部变量？不幸的是，运气不好@BalázsÉdes，我真的很难对付它。几乎需要创建某种绑定。我想不出别的办法了。谢谢雅各布，这让事情变得更近了，但仍然有一个问题。我得到以下错误。未捕获引用错误：未定义CreditPermeal。有办法通过这个吗？它可能是输入的值。这行得通吗？事实上，这会使它们都一样吗？我仍然收到一个错误，未捕获的TypeError:_vm.createSelection不是一个函数。你是否撤消了没有被数组替换的createSelection？我尝试了一个没有，没有原始的createSelection，我收到这个错误消息$1.createSelection.push不是一个函数。

methods: {
   createSelection (){
       for (var i = 0; i < JSON.parse(this.f).length; i++) {
           this.createSelection.push({
              food: JSON.parse(this.f)[i],
              quantity: creditsPerMeal[JSON.parse(this.f)[i]]
           })
       }
   }
 }