Javascript 组件渲染函数中可能有无限更新循环？

我不熟悉

Vue.js

。我的函数不是将变量增加到1，而是将其增加到任意随机数。控制台显示此错误：

“组件渲染函数中可能存在无限更新循环”`

有什么不对劲

<template lang="pug">
  #homepage
    .workArea
      button(
          v-on:click='clicker'
          ) 
            |click me
      p      
        |{{clicker()}}

</template>
<script>
export default {
  name: "test",
  data: () => ({
    a: 0,
  }),
  methods: {
    clicker() {
      return this.a++
    },
  },
}
</script>

#主页
.工作区
钮扣(
v-on：单击“点击器”
) 
|点击我
P
|{{clicker（）}}
导出默认值{
名称：“测试”，
数据：（）=>({
答:0,，
}),
方法：{
点击器（）{
还这个++
},
},
}

除了关于输出值的部分外，您的代码正常。您应该使用{a}来显示数据

<template lang="pug">

#homepage
    .workArea
      button(
          v-on:click='clicker'
          ) 
            |click me
      p      
        |{{a}}

</template>
<script>
export default {
  name: "test",
  data: () => ({
    a: 0,
  }),
  methods: {
    clicker() {
      return this.a++
    },
  },
}
</script>

#主页
.工作区
钮扣(
v-on：单击“点击器”
) 
|点击我
P
|{{a}
导出默认值{
名称：“测试”，
数据：（）=>({
答:0,，
}),
方法：{
点击器（）{
还这个++
},
},
}

单击按钮时，您正在调用

clicker

方法

因此，点击按钮，增加

a

。更新

a

后，Vue实例将尝试重新渲染视图。此时，不是简单地打印

a

的值，而是字符串插值内的方法调用导致再次递增

a

。这是一个连续的循环

希望问题清楚。只需将change

{{clicker}}

更改为

{a}

不要使用

{{clicker（）}

打印值。使用

{{a}

。