当引用与计算中相同的键时，Vue 计算会抛出“渲染中的错误：“内部错误：递归过多””

Question

我是 Vue 的新手。我想知道计算中的函数被调用了多少次，所以我写了这个组件：

const ComputedCounter = {

    name: "ComputedCounter",

    template: `

        <span>{{ value }}</span>

    `,

    computed: {

        value() {

            const current = this.value || 0;

            return current + 1;

        }

    }

}

但是，会抛出“渲染错误：“内部错误：递归过多””错误。我很困惑，这里发生了什么，有没有办法使这项工作？

Answer 1

如果您阅读文档：计算属性仅在其某些反应性依赖项发生更改时才会重新评估。这意味着如果您的值this.value发生变化，那么您的计算属性将被执行。但问题是，如果您执行您更改的计算属性value。现在因为值已经改变，你再次执行你的计算属性，因为这value已经改变了，女巫再次导致你的计算属性再次被执行，依此类推，我希望你能得到它。

Answer 2

我在您的递归中看不到停止条件太多递归相当于超出最大调用堆栈大小所以这是 js 问题而不是 vue

Answer 3

在您的数据中，设置：_value:&nbsp;0那么你可以在你的 value() 方法中引用 this._value ：value()&nbsp;{&nbsp; &nbsp;&nbsp;&nbsp;return&nbsp;this._value++; &nbsp;&nbsp;&nbsp;}