RS水果 发表于 2021-8-6 21:55

简单Vue插值语法求讲解



请教 这里的a++为什么是121 ?

零下八度 发表于 2021-8-6 22:23

不要在{{}}里面运算就可以了

E式丶男孩 发表于 2021-8-6 22:31

我去,我用vue这么久,都没发现这个问题
在我亲手试了试发现确实有这个问题
但是这不是个bug,我只知道为什么不对,但是却不知道为什么是这个值
如果有大佬知道还请说一下
我在仔细查看官网文档后发现
插值的时候是只能插单个表达式的
在js中,
i++ <=> i= i + 1
这是取值加赋值两个过程,且不是一个表达式
原文是这样的

---
## 使用 JavaScript 表达式
> 迄今为止,在我们的模板中,我们一直都只绑定简单的 property 键值。但实际上,对于所有的数据绑定,Vue.js 都提供了完全的 JavaScript 表达式支持。

```
{{ number + 1 }}
{{ ok ? 'YES' : 'NO' }}
{{ message.split('').reverse().join('') }}
<div v-bind:id="'list-' + id"></div>
```

> 这些表达式会在所属 Vue 实例的数据作用域下作为 JavaScript 被解析。有个限制就是,每个绑定都只能包含单个表达式,所以下面的例子都不会生效。

```
<!-- 这是语句,不是表达式 -->
{{ var a = 1 }}

<!-- 流控制也不会生效,请使用三元表达式 -->
{{ if (ok) { return message } }}
```

轩宸 发表于 2021-8-6 22:38

个人理解,你这属于使用 JavaScript 表达式,响应式数据a一直在自增,最后可能是自增到某个阈值就停止了,或者可能是某方面的限制停止。
我用多个数字试了应该是只能自增101次,具体原因等其他人解答

泪鱼无梦 发表于 2021-8-6 22:50

应该是vue执行的时候发现你这里++了,重新渲染了,第二遍渲染的时候又发现了++,又重新渲染了,以此无限循环,才导致了121这个结果,vue作者应该考虑到这种无限循环的情况了,所以最多应该就会重复执行101次

motionless 发表于 2021-8-6 23:16

RS水果 发表于 2021-8-6 23:24



是的 用watch监视后 发现确实如此循环被vue限制为100次 所以最后报错了

cube 发表于 2021-8-6 23:47

vue是数据响应式的.
首先render渲染执行a++, 然后数据响应,而数据响应之后又会通知render渲染,如此循环.
尤大对此必然要实现一种保护,即MAX_UPDATE_COUNT,到达此阈值即警告并退出当前调度.

侠骨留香喵 发表于 2021-8-7 09:01

之前看过一个别人讲的视频,说过此问题。参考:https://www。bilibili。com/video/BV1ep4y1s7w5?p=2

fankangfan 发表于 2021-8-7 09:33

长知识了
页: [1] 2
查看完整版本: 简单Vue插值语法求讲解