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

Posted 2023-02-23

【中文标题】从 Vue.js 2 中的计算属性中推送到数组

【英文标题】：Push to an array from with in a computed property in Vue.js 2

【发布时间】：2017-06-01 22:51:51

【问题描述】：

我希望在 Vue.js 2 的计算属性中从 with 推送到数组，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>

【参考方案1】：

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

   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]]
              )
          
      
   

另外error during evaluation不是问题描述，也不是Vue的问题，能否提供更详细的错误信息？

【讨论】：

感谢您的回复，是的，这是一个 Vue 错误，因为它只显示在 Vue 开发工具中，而不是控制台中。我会试试你的代码。

所以补充说，现在需要调用该方法最好的方法是什么？也许看？

你需要在哪里调用这个方法？我在问题代码中看不到createSelection 标识符的调用。顺便说一句，data 函数执行一些操作看起来也很奇怪，我建议只返回 dic 并在created 挂钩中进行变量初始化。 createSelection 数组也应该在数据内部，当你使用它时，你应该像 this.createSelection 那样引用它，还有一件事 - 将方法（或计算方法）与数据变量同名并不是一个好主意。跨度>