[Vue警告]:Vue.js中的渲染错误:“ TypeError:this.input.reduce不是函数”

时间:2019-08-27 18:52:38

标签: laravel vue.js

我正在使用Amount中的computed创建vuejs的表的简单汇总,但是出现问题

  

[Vue警告]:渲染错误:“ TypeError:this.input.reduce不是函数”

还是,我无法用我的代码弄清楚。

//我的Vue js

<pre>
      <div class="table-responsive">
        <table class="table table-bordered">
            <thead>
                <tr>
                    <th>Current_id</th>
                    <th>Date</th>
                    <th>Description</th>
                    <th>Amount</th>
                    <th colspan="2">Modify</th>
                </tr>
            </thead>
            <tbody>
                <tr v-for="(user,key) in users">
                    <td>{{ user.user.name }}</td>
                    <td>{{ user.date }}</td>
                    <td>{{ user.description }}</td>
                    <td>${{ user.amount }}</td>
                    <td @click.prevent="editUser(key)">
                        <span class="btn btn-info">Edit</span>
                    </td>
                    <td @click.prevent="remove(user.id)">
                        <span class="btn btn-danger">Delete</span>
                    </td>
                </tr>
            </tbody>
        </table>
    </div>
    <div>
        <p>Total of Amount {{ total }}</p>
    </div>  
</pre>

//我的Script文件

<pre>
    data() {
        return {
            users: [],
            input: {
                date: "",
                description: "",
                amount: ""
            },
            edit: false,
            add: true,

        }
    },

    computed: {
        total() {
            return this.input.reduce((total, item) => {
                return total + item.amount;
            }, 0);
        }
    },
</pre>

有帮助吗?谢谢...

0 个答案:

没有答案