信息
这是一个低级的内部 API 更改,不会影响大多数开发人员。
下面是对这些变化的高层次总结:
false。相反,它被设置为 attr=“false”。移除 attribute,使用 null或者 undefined。如需更深入的解释,请继续阅读!
在 2.x,我们有以下策略来强制 v-bind的值:
value的 ,,``,等等。falsy的,Vue 会移除它们 (undefined,nullor false) 另外加上它们 (见这里和这里)。contenteditable,draggable和 spellcheck),Vue 会尝试强制将它们串起来 (目前对 contenteditable做了特殊处理,修复 vuejs/vue#9397)。falsy值 (undefined,null,or false) 并按原样设置其他值 (见这里)。下表描述了 Vue 如何使用普通非布尔 attribute 强制“枚举 attribute”:
| 绑定表达式 | foo正常 | draggable枚举 |
|---|---|---|
:attr="null" | / | draggable="false" |
:attr="undefined" | / | / |
:attr="true" | foo="true" | draggable="true" |
:attr="false" | / | draggable="false" |
:attr="0" | foo="0" | draggable="true" |
attr="" | foo="" | draggable="true" |
attr="foo" | foo="foo" | draggable="true" |
attr | foo="" | draggable="true" |
从上表可以看出,当前实现 true强制为 'true'但如果 attribute 为 false,则移除该 attribute。这也导致了不一致性,并要求用户在非常常见的用例中手动强制布尔值为字符串,例如 aria-*attribute 像 aria-selected,aria-hidden,等等。
我们打算放弃“枚举 attribute”的内部概念,并将它们视为普通的非布尔 HTML attribute。
'true'和 'false'以外的值,甚至可以使用 contenteditable等 attribute 的关键字`对于非布尔 attribute,如果 attribute 为 false,Vue 将停止删除它们,相反强制它们为 'false'。
true和 false之间的不一致性,并使输出 aria-*attributes 更容易下表描述了新行为:
| 绑定表达式 | foo正常 | draggable枚举 |
|---|---|---|
:attr="null" | / | / † |
:attr="undefined" | / | / |
:attr="true" | foo="true" | draggable="true" |
:attr="false" | foo="false"† | draggable="false" |
:attr="0" | foo="0" | draggable="0"† |
attr="" | foo="" | draggable=""† |
attr="foo" | foo="foo" | draggable="foo"† |
attr | foo="" | draggable=""† |
†: 变更
布尔 attributes 的强制保持不变。
缺少枚举 attribute 和 attr="false"可能会产生不同的 IDL attribute 值 (将反映实际状态),描述如下:
| 缺少枚举attr | IDL attr & 值 |
|---|---|
contenteditable | contentEditable→ 'inherit' |
draggable | draggable→ false |
spellcheck | spellcheck→ true |
为了保持原有的行为,并且我们将强制使用 false为 'false',在 3.x Vue 中,开发人员需要将 v-bind表达式解析为 false或 'false',表示 contenteditable和 spellcheck。
在 2.x 中,枚举 attribute 的无效值被强制为 'true'。这通常是无意的,不太可能大规模依赖。在 3.x 中,应显式指定 true或 'true'。
false强制为 'false'而不是删除 attribute在 3.x,null或 undefined应用于显式删除 attribute。
| Attributes | v-bindvalue 2.x | v-bindvalue 3.x | HTML 输出 |
|---|---|---|---|
2.x “枚举attribute” i.e. contenteditable, draggableand spellcheck. | undefined, false | undefined, null | removed |
true, 'true', '', 1, 'foo' | true, 'true' | "true" | |
null, 'false' | false, 'false' | "false" | |
其他非布尔attribute eg. aria-checked, tabindex, alt, etc. | undefined, null, false | undefined, null | removed |
'false' | false, 'false' | "false" |