vue3 与 vue2 的区别

布尔型 Attribute​

布尔型 attribute 依据 true / false 值来决定 attribute 是否应该存在于该元素上。disabled 就是最常见的例子之一。

v-bind 在这种场景下的行为略有不同：

<button :disabled="isButtonDisabled">Button</button>

当 isButtonDisabled 为真值或一个空字符串(即<button disabled="">)时，元素会包含这个 disabled attribute。而当其为其他假值时 attribute 将被忽略。

v-if 和 v-for​

v-if 和 v-for​

同时使用 v-if 和 v-for 是不推荐的，因为这样二者的优先级不明显。

vue2当 v-if 和 v-for 同时存在于一个元素上的时候，v-for 会首先被执行。

vue3当 v-if 和 v-for 同时存在于一个元素上的时候，v-if 会首先被执行。

在 v-for 里使用范围值​

v-for 可以直接接受一个整数值。在这种用例中，会将该模板基于 1...n 的取值范围重复多次。

<span v-for="n in 10">{{ n }}</span>

注意此处 n 的初值是从 1 开始而非 0。