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
Copy file name to clipboardExpand all lines: src/guide/migration/render-function-api.md
+28-28Lines changed: 28 additions & 28 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -3,41 +3,43 @@ badges:
3
3
- breaking
4
4
---
5
5
6
-
# Render Function API <MigrationBadges:badges="$frontmatter.badges" />
6
+
# API da Função de Renderização <MigrationBadges:badges="$frontmatter.badges" />
7
7
8
-
## Overview
8
+
## Visão Geral
9
9
10
-
This change will not affect `<template>` users.
10
+
Esta mudança não vai afetar usuários de `<template>`.
11
11
12
-
Here is a quick summary of what has changed:
12
+
Aqui está um rápido resumo do que mudou:
13
13
14
-
-`h`is now globally imported instead of passed to render functions as an arguments
15
-
-render function arguments changed to be more consistent between stateful and functional components
16
-
- VNodes now have a flat props structure
14
+
-`h`agora é globalmente importado em vez de passado como argumento para funções de renderização
15
+
-Argumentos da função render mudaram para ser mais consistentes entre componentes funcionais e com estado
16
+
- VNodes agora têm uma estrutura plana de props
17
17
18
-
For more information, read on!
19
18
20
-
## Render Function Argument
19
+
Para mais informações, continue lendo!
21
20
22
-
### 2.x Syntax
21
+
## Argumento da Função Render
22
+
23
+
### Sintaxe 2.x
23
24
24
-
In 2.x, the `render`function would automatically receive the `h`function (which is a conventional alias for `createElement`) as an argument:
25
+
Na versão 2.x, a função `render`receberia automaticamente a função `h`(que é um _alias_ para `createElement`) como argumento:
25
26
26
27
```js
27
-
//Vue 2 Render Function Example
28
+
//Exemplo da Função Render no Vue 2
28
29
exportdefault {
29
30
render(h) {
30
31
returnh('div')
31
32
}
32
33
}
33
34
```
34
35
35
-
### 3.x Syntax
36
+
### Sintaxe 3.x
37
+
38
+
Na versão 3.x, o `h` agora é importado globalmente em vez de automaticamente passado como um argumento.
36
39
37
-
In 3.x, `h` is now globally imported instead of being automatically passed as an argument.
38
40
39
41
```js
40
-
//Vue 3 Render Function Example
42
+
//Exemplo da Função Render no Vue 3
41
43
import { h } from'vue'
42
44
43
45
exportdefault {
@@ -46,25 +48,24 @@ export default {
46
48
}
47
49
}
48
50
```
51
+
## Mudança da assinatura da função Render
49
52
50
-
##Render Function Signature Change
53
+
### Sintaxe 2.x
51
54
52
-
### 2.x Syntax
53
-
54
-
In 2.x, the `render` function automatically received arguments such as `h`.
55
+
Na versão 2.x, a função `render` recebeu automaticamente argumentos como o `h`.
55
56
56
57
```js
57
-
//Vue 2 Render Function Example
58
+
//Exemplo da Função Render no Vue 2
58
59
exportdefault {
59
60
render(h) {
60
61
returnh('div')
61
62
}
62
63
}
63
64
```
65
+
### Sintaxe 3.x
64
66
65
-
### 3.x Syntax
67
+
Na versão 3.x, desde que a função `render` já não recebe argumentos, ela será primeiramente usada dentro da função `setup()`. Isso traz o benefício adicional em ganhar acesso para o estado reativo e às funções declaradas no escopo, assim como argumentos passados para o `setup()`.
66
68
67
-
In 3.x, since the `render` function no longer receives any arguments, it will primarily be used inside of the `setup()` function. This has the added benefit of gaining access to reactive state and functions declared in scope, as well as the arguments passed to `setup()`.
68
69
69
70
```js
70
71
import { h, reactive } from'vue'
@@ -79,7 +80,7 @@ export default {
79
80
state.count++
80
81
}
81
82
82
-
//return the render function
83
+
//retorna a função render
83
84
return () =>
84
85
h(
85
86
'div',
@@ -91,14 +92,13 @@ export default {
91
92
}
92
93
}
93
94
```
95
+
Para mais informações em como o `setup()` funciona, veja nosso [Guia da API de Composição](/guide/composition-api-introduction.html).
94
96
95
-
For more information on how `setup()` works, see our [Composition API Guide](/guide/composition-api-introduction.html).
97
+
## Formato de Props VNode
96
98
97
-
## VNode Props Format
98
-
99
-
### 2.x Syntax
99
+
### Sintaxe 2.x
100
100
101
-
In 2.x, `domProps`contained a nested list within the VNode props:
101
+
Na versão 2.x, o `domProps`continha uma lista aninhada dentro dos props VNode:
0 commit comments