You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
# Comportamento de Coerção de Atributo <MigrationBadges:badges="$frontmatter.badges" />
7
7
8
-
::: info Info
9
-
This is a low-level internal API change and does not affect most developers.
8
+
::: Informação:
9
+
Esta é uma alteração de baixo nível da API interna e não afeta a maioria dos desenvolvedores.
10
10
:::
11
11
12
-
## Overview
12
+
## Visão Geral
13
13
14
-
Here is a high level summary of the changes:
14
+
Aqui está um resumo de alto nível das mudanças:
15
15
16
-
-Drop the internal concept of enumerated attributes and treat those attributes the same as normal non-boolean attributes
17
-
-**BREAKING**: No longer removes attribute if value is boolean `false`. Instead, it's set as attr="false" instead. To remove the attribute, use `null`or`undefined`.
16
+
-Abandone o conceito interno de atributos enumerados e trate esses atributos da mesma forma que atributos normais não booleanos
17
+
-**URGENTE**: Não remova mais o atributo se o valor for booleano `false`. Em vez disso, é definido como attr="false". Para remover o atributo, use `null`ou`undefined`.
18
18
19
-
For more information, read on!
19
+
Para mais informações, continue lendo!
20
20
21
-
## 2.x Syntax
21
+
## Sintaxe 2.x
22
22
23
-
In 2.x, we had the following strategies for coercing `v-bind` values:
23
+
No 2.x, tínhamos as seguintes estratégias para forçar os valores `v-bind`:
24
24
25
-
-For some attribute/element pairs, Vue is always using the corresponding IDL attribute (property): [like `value` of`<input>`, `<select>`, `<progress>`, etc](https://github.com/vuejs/vue/blob/bad3c326a3f8b8e0d3bcf07917dc0adf97c32351/src/platforms/web/util/attrs.js#L11-L18).
25
+
-Para alguns pares de atributo/elemento, Vue está sempre usando o atributo IDL correspondente (propriedade): [como `valores` de`<input>`, `<select>`, `<progress>`, etc](https://github.com/vuejs/vue/blob/bad3c326a3f8b8e0d3bcf07917dc0adf97c32351/src/platforms/web/util/attrs.js#L11-L18).
26
26
27
-
-For "[boolean attributes](https://github.com/vuejs/vue/blob/bad3c326a3f8b8e0d3bcf07917dc0adf97c32351/src/platforms/web/util/attrs.js#L33-L40)" and[xlinks](https://github.com/vuejs/vue/blob/bad3c326a3f8b8e0d3bcf07917dc0adf97c32351/src/platforms/web/util/attrs.js#L44-L46), Vue removes them if they are "falsy" ([`undefined`, `null`or`false`](https://github.com/vuejs/vue/blob/bad3c326a3f8b8e0d3bcf07917dc0adf97c32351/src/platforms/web/util/attrs.js#L52-L54)) and adds them otherwise (see [here](https://github.com/vuejs/vue/blob/bad3c326a3f8b8e0d3bcf07917dc0adf97c32351/src/platforms/web/runtime/modules/attrs.js#L66-L77)and [here](https://github.com/vuejs/vue/blob/bad3c326a3f8b8e0d3bcf07917dc0adf97c32351/src/platforms/web/runtime/modules/attrs.js#L81-L85)).
27
+
-Para "[atributos booleanos](https://github.com/vuejs/vue/blob/bad3c326a3f8b8e0d3bcf07917dc0adf97c32351/src/platforms/web/util/attrs.js#L33-L40)" e[xlinks](https://github.com/vuejs/vue/blob/bad3c326a3f8b8e0d3bcf07917dc0adf97c32351/src/platforms/web/util/attrs.js#L44-L46), o Vue os remove se forem "falsos" ([`undefined`, `null`ou`false`](https://github.com/vuejs/vue/blob/bad3c326a3f8b8e0d3bcf07917dc0adf97c32351/src/platforms/web/util/attrs.js#L52-L54)) e os adiciona de outra forma (veja [aqui](https://github.com/vuejs/vue/blob/bad3c326a3f8b8e0d3bcf07917dc0adf97c32351/src/platforms/web/runtime/modules/attrs.js#L66-L77)e [aqui](https://github.com/vuejs/vue/blob/bad3c326a3f8b8e0d3bcf07917dc0adf97c32351/src/platforms/web/runtime/modules/attrs.js#L81-L85)).
28
28
29
-
-For "[enumerated attributes](https://github.com/vuejs/vue/blob/bad3c326a3f8b8e0d3bcf07917dc0adf97c32351/src/platforms/web/util/attrs.js#L20)" (currently`contenteditable`, `draggable`and`spellcheck`), Vue tries to [coerce](https://github.com/vuejs/vue/blob/bad3c326a3f8b8e0d3bcf07917dc0adf97c32351/src/platforms/web/util/attrs.js#L24-L31)them to string (with special treatment for`contenteditable`for now, to fix[vuejs/vue#9397](https://github.com/vuejs/vue/issues/9397)).
29
+
-Para "[atributos enumerados](https://github.com/vuejs/vue/blob/bad3c326a3f8b8e0d3bcf07917dc0adf97c32351/src/platforms/web/util/attrs.js#L20)" (atualmente`contenteditable`, `draggable`e`spellcheck`), Vue tenta [coagir](https://github.com/vuejs/vue/blob/bad3c326a3f8b8e0d3bcf07917dc0adf97c32351/src/platforms/web/util/attrs.js#L24-L31)eles para string (com tratamento especial para`contenteditable`por enquanto, para corrigir o problema[vuejs/vue#9397](https://github.com/vuejs/vue/issues/9397)).
30
30
31
-
-For other attributes, we remove "falsy" values (`undefined`, `null`, or`false`) and set other values as-is (see [here](https://github.com/vuejs/vue/blob/bad3c326a3f8b8e0d3bcf07917dc0adf97c32351/src/platforms/web/runtime/modules/attrs.js#L92-L113)).
31
+
-Para outros atributos, removemos valores "falsos" (`undefined`, `null` ou`false`) e definimos outros valores como estão (veja [aqui](https://github.com/vuejs/vue/blob/bad3c326a3f8b8e0d3bcf07917dc0adf97c32351/src/platforms/web/runtime/modules/attrs.js#L92-L113)).
32
32
33
-
The following table describes how Vue coerce "enumerated attributes" differently with normal non-boolean attributes:
33
+
A tabela a seguir descreve como o Vue coage os "atributos enumerados" de maneira diferente com atributos normais não booleanos:
@@ -43,22 +43,22 @@ The following table describes how Vue coerce "enumerated attributes" differently
43
43
|`attr="foo"`|`foo="foo"`|`draggable="true"`|
44
44
|`attr`|`foo=""`|`draggable="true"`|
45
45
46
-
We can see from the table above, current implementation coerces `true`to`'true'` but removes the attribute if it's`false`. This also led to inconsistency and required users to manually coerce boolean values to string in very common use cases like `aria-*`attributes like `aria-selected`,`aria-hidden`, etc.
46
+
Podemos ver na tabela acima, a implementação atual força `true`para`'true'`, mas remove o atributo se for`false`. Isso também levou à inconsistência e obrigou os usuários a forçar manualmente os valores booleanos para string em casos de uso muito comuns, como atributos `aria-*`como `aria-selected`,`aria-hidden`, etc.
47
47
48
-
## 3.x Syntax
48
+
## Sintaxe 3.x
49
49
50
-
We intend to drop this internal concept of "enumerated attributes" and treat them as normal non-boolean HTML attributes.
50
+
Pretendemos abandonar esse conceito interno de "atributos enumerados" e tratá-los como atributos HTML não booleanos normais.
51
51
52
-
-This solves the inconsistency between normal non-boolean attributes and “enumerated attributes”
53
-
-It also makes it possible to use values other than `'true'`and`'false'`, or even keywords yet to come, for attributes like`contenteditable`
52
+
-Isso resolve a inconsistência entre os atributos normais não booleanos e "atributos enumerados"
53
+
-Também torna possível usar valores diferentes de `'true'`e`'false'`, ou mesmo palavras-chave ainda por vir, para atributos como`contenteditable`
54
54
55
-
For non-boolean attributes, Vue will stop removing them if they are `false` and coerce them to`'false'` instead.
55
+
Para atributos não booleanos, o Vue irá parar de removê-los se eles forem `falsos` e forçá-los a serem`'falsos'`.
56
56
57
-
-This solves the inconsistency between`true`and`false` and makes outputting `aria-*`attributes easier
57
+
-Isso resolve a inconsistência entre`true`e`false`, e torna a saída dos atributos `aria-*`mais fácil
Coercion for boolean attributes is left untouched.
74
+
A coerção para atributos booleanos não foi alterada.
75
75
76
-
## Migration Strategy
76
+
## Estratégia de Migração
77
77
78
-
### Enumerated attributes
78
+
### Atributos enumerados
79
79
80
-
The absence of an enumerated attribute and`attr="false"`may produce different IDL attribute values (which will reflect the actual state), described as follows:
80
+
A ausência de um atributo enumerado e`attr="false"`pode produzir diferentes valores de atributo IDL (que refletirão o estado real), descritos a seguir:
To keep the old behavior work, and as we will be coercing `false`to`'false'`, in 3.xVue developers need to make `v-bind`expression resolve to`false`or`'false'`for`contenteditable`and`spellcheck`.
88
+
Para manter o comportamento antigo funcionando, e como estaremos coagindo `false`para`'false'`, no 3.x, os desenvolvedores Vue precisam fazer com que a expressão `v-bind`seja resolvida para`false`ou`'false'`para`contenteditable`e`spellcheck`.
89
89
90
-
In 2.x, invalid values were coerced to `'true'`for enumerated attributes. This was usually unintended and unlikely to be relied upon on a large scale. In 3.x `true`or`'true'`should be explicitly specified.
90
+
No 2.x, os valores inválidos foram forçados a `'true'`para atributos enumerados. Isso geralmente não era intencional e improvável de ser invocado em grande escala. Em 3.x `true`ou`'true'`deve ser explicitamente especificado.
91
91
92
-
### Coercing`false`to `'false'`instead of removing the attribute
92
+
### Coagir`false`para`'false'`em vez de remover o atributo
93
93
94
-
In 3.x, `null`or`undefined`should be used to explicitly remove an attribute.
94
+
No 3.x, `null`ou`undefined`devem ser usados explicitamente para remover um atributo.
95
95
96
-
### Comparison between 2.x & 3.x behavior
96
+
### Comparação entre o comportamento 2.x e 3.x
97
97
98
98
<table>
99
99
<thead>
100
100
<tr>
101
-
<th>Attribute</th>
102
-
<th><code>v-bind</code> value <sup>2.x</sup></th>
103
-
<th><code>v-bind</code> value <sup>3.x</sup></th>
104
-
<th>HTML output</th>
101
+
<th>Atributo</th>
102
+
<th> valor <code>v-bind</code> <sup>2.x</sup></th>
103
+
<th> valor <code>v-bind</code> <sup>3.x</sup></th>
104
+
<th>Saída HTML</th>
105
105
</tr>
106
106
</thead>
107
107
<tbody>
108
108
<tr>
109
-
<td rowspan="3">2.x “Enumerated attrs”<br><small>i.e. <code>contenteditable</code>, <code>draggable</code> and <code>spellcheck</code>.</small></td>
109
+
<td rowspan="3">2.x “Atributos enumerados”<br><small>ou seja: <code>contenteditable</code>, <code>draggable</code> e <code>spellcheck</code>.</small></td>
0 commit comments