gpt4 book ai didi

vue.js - Vue js 增量运算符(++)没有给出预期的输出

转载 作者:行者123 更新时间:2023-12-04 07:57:59 24 4
gpt4 key购买 nike

为什么下面的 vue js 代码显示输出 102。

<html>
<head>
<script src="https://cdn.jsdelivr.net/npm/vue@2/dist/vue.js"></script>
</head>
<body>
<div id = "intro" style = "text-align:center;">
<h1>{{ ++serial }}</h1>
</div>
<script type = "text/javascript">
var app = new Vue({
el: '#intro',
data: {
serial: 0
}
});
</script>
</body>
</html>
我需要一个解释。我的预期输出是 1。如何解决这个问题?

最佳答案

不允许在模板内运行更新组件属性的语句,因为这会造成无限循环,您可以使用计算属性实现所需的行为,如下所示:

var app = new Vue({
el: '#intro',
data: {
serial: 0
},
computed: {
incrementedSerial() {
return ++this.serial
}
}
});
<script src="https://cdn.jsdelivr.net/npm/vue@2/dist/vue.js"></script>

<div id="intro" style="text-align:center;">
<h1>{{ incrementedSerial }}</h1>
</div>

关于vue.js - Vue js 增量运算符(++)没有给出预期的输出,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/66605315/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com