这是我的代码
<html>
<head>
<script src="https://unpkg.com/vue"></script>
<meta charset="utf-8">
</head>
<body>
<div id="app">
<button v-on:click="increase">plus</button>
<p>Counter : {{ counter }}</p>
<p>Clicks : {{ clicks }}</p>
</div>
<script>
var app = new Vue({
el:'#app',
data:{
counter : 0,
clicks : 0
},
methods:{
increase(){
this.clicks++;
}
},
computed:{
counter: function(){
return this.clicks * 2;
}
}
});
</script>
</body>
</html>
当我点击按钮时，计数器应该将显示的点击次数加倍，但它不起作用。
这段代码虽然有效:COMPUTED PROPERTIES | VueJS 2 | Learning the Basics .
最佳答案
您的数据中有一个 counter 属性，您还有一个 counter 计算值。要修复您的代码，只需从数据中删除 counter。
data:{
clicks : 0
},
这在您链接的视频的评论中得到解决。如果您注意到，他在添加计算后从未真正运行过代码。
那是说我刚开始时自己使用他的视频和类(class)作为资源。它们大部分都非常出色。
关于vue.js - 计算属性 "counter"已在数据中定义，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/44613084/