Appearance
Opção data
rutura
Visão Geral
RUTURA: a declaração da opção de componente
data
já não aceita umobject
de JavaScript simples e espera uma declaração defunction
.RUTURA: quando combinamos vários valores de retorno de
data
a partir de misturas ou extensões, a combinação agora é superficial ao invés de profunda (apenas as propriedades do nível da raiz são combinadas).
Sintaxe da 2.x
Na 2.x, os programadores poderiam definir a opção data
ou com um object
ou uma function
.
Por exemplo:
html
<!-- Declaração de Objeto -->
<script>
const app = new Vue({
data: {
apiKey: 'a1b2c3'
}
})
</script>
<!-- Declaração de Função -->
<script>
const app = new Vue({
data() {
return {
apiKey: 'a1b2c3'
}
}
})
</script>
Embora isto fornecesse alguma conveniência em termos de instâncias de raiz terem um estado partilhado, isto levava à confusão devido ao fato de que apenas é possível na instância de raiz.
Atualização da 3.x
Na 3.x, a opção data
foi padronizada para apenas aceitar uma function
que retorna um object
.
Usando o exemplo acima, apenas existiria uma implementação possível do código:
html
<script>
import { createApp } from 'vue'
createApp({
data() {
return {
apiKey: 'a1b2c3'
}
}
}).mount('#app')
</script>
Mudança do Comportamento de Combinação de Mistura
Além disto, quando data()
dum componente e suas misturas ou base de extensões forem combinadas, a combinação agora é realizada superficialmente:
js
const Mixin = {
data() {
return {
user: {
name: 'Jack',
id: 1
}
}
}
}
const CompA = {
mixins: [Mixin],
data() {
return {
user: {
id: 2
}
}
}
}
Na Vue 2.x, a $data
resultante é:
json
{
"user": {
"id": 2,
"name": "Jack"
}
}
Na 3.0, o resultado será:
json
{
"user": {
"id": 2
}
}
Opção da Construção de Migração: OPTIONS_DATA_FN
Estratégia de Migração
Para os utilizadores que dependem da declaração de objeto, recomendamos:
- Extrair os dados partilhados para um objeto eterno e usá-lo como uma propriedade na
data
- Reescrever as referências aos dados partilhados para apontarem para um novo objeto partilhado
Para os utilizadores que dependem do comportamento de combinação profunda das misturas, recomendamos refazer o código para evitar tal dependência completamente, uma vez que combinações profundas das misturas são muitos implícitas e podem tornar a lógica do código mais difícil de entender e depurar.
Opções da Construção de Migração:
OPTIONS_DATA_FN
OPTIONS_DATA_MERGE