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: content/pt/docs/3.features/4.data-fetching.md
+5-3Lines changed: 5 additions & 3 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -24,7 +24,7 @@ Estas funções gatilhos podem ser utilizadas com _qualquer biblioteca de recolh
24
24
Se definirmos `fetch` ou `asyncData` dentro de uma mistura e também tivermos definido num componente ou página, a função de mistura será substituída em vez de ser chamada.
25
25
::
26
26
27
-
## A função gatilho`fetch`
27
+
## A Função Gatilho`fetch`
28
28
29
29
::alert{type="info"}
30
30
**Nas versões anteriores a 2.12 da Nuxt, existia uma função gatilho `fetch` diferente que só funcionava para componentes de _página_ e não tinha acesso à instância do componente.**
@@ -77,7 +77,8 @@ export default {
77
77
// pode ser passada uma função com acesso à instância do componente.
78
78
// Será chamada em `created` e não deve depender de dados obtidos.
79
79
fetchKey(getCounter) {
80
-
// `getCounter` é um método que pode ser chamado para obter o número seguinte numa sequência
80
+
// `getCounter` é um método que pode ser chamado para obter
81
+
// o número seguinte numa sequência
81
82
// como parte da geração duma única `fetchKey`.
82
83
returnthis.someOtherData+getCounter('sidebar')
83
84
}
@@ -213,7 +214,8 @@ A Nuxt preencherá diretamente a `this.$fetchState.timestamp` (o registo de data
213
214
}
214
215
},
215
216
activated() {
216
-
// Chamar novamente a `fetch` se a última `fetch` ocorreu há mais de 30 segundos.
217
+
// Chamar novamente a `fetch` se a última chamada de `fetch`
218
+
// ocorreu há mais de 30 segundos.
217
219
if (this.$fetchState.timestamp <= Date.now() - 30000) {
description: O gatilho fetch serve para requisição assíncrona de dados. Ele é chamado no lado do servidor quando estiver renderizando a rota, e no lado do cliente quando estiver navegando entre as rotas.
2
+
title: Função Gatilho de Obtenção de Dados
3
+
description: A função gatilho de obtenção de dados serve para buscar dados duma maneira assíncrona. É chamada no lado do servidor quando ao desenhar a rota, e no lado do cliente ao navegar.
4
4
navigation:
5
-
title: Gatilho Fetch
5
+
title: Função Fetch
6
6
category: components-glossary
7
7
---
8
-
# O Gatilho Fetch
9
8
10
-
O gatilho `fetch` serve para requisição assíncrona de dados. Ele é chamado no lado do servidor quando estiver renderizando a rota, e no lado do cliente quando estiver navegando entre as rotas.
9
+
# Função Gatilho de Obtenção de Dados
10
+
11
+
A função gatilho `fetch` serve para buscar dados duma maneira assíncrona. É chamada no lado do servidor quando ao desenhar a rota, e no lado do cliente ao navegar.
11
12
12
13
---
13
14
14
-
## Em versões do Nuxt maiores ou igual 2.12
15
+
## Nuxt >= 2.12
15
16
16
-
A versão `2.12`do Nuxt introduz um novo gatilho chamado`fetch`o qual você pode usar **dentro de qualquer um de seus componentes de Vue**. Use o`fetch`toda vez que você precisar receber dados **assíncronos**. O`fetch` é chamado no lado do servidor quando estiver renderizando a rota, e no lado do cliente quando estiver navegando entre as rotas.
17
+
A Nuxt `v2.12` introduz uma nova função gatilho chamada`fetch`que podemos usar **em qualquer um dos nossos componentes `.vue`**, Usamos a`fetch`sempre que precisarmos de obter dados **assíncronos**. A`fetch` é chamada no lado do servidor ao desenhar a rota, e no lado do cliente ao navegar.
17
18
18
-
Ele expõe o `$fetchState`no nível de componente:
19
+
Expõe a `$fetchState`ao nível do componente:
19
20
20
-
-`$fetchState.pending`: `Boolean`, permite você mostrar um segurador de espaço quando o`fetch`estiver sendo chamado_no lado do cliente_.
21
-
-`$fetchState.error`: `null` ou `Error`, permite você mostrar uma mensagem de erro
22
-
-`$fetchState.timestamp`: `Integer`, é uma referência a data e hora da última requisição, útil para cacheamento com o `keep-alive`
21
+
-`$fetchState.pending`: `Boolean`, permite-nos mostrar um marcador de posição quando a`fetch`for chamada_no lado do cliente_.
22
+
-`$fetchState.error`: `null` ou `Error`, permite-nos mostrar uma mensagem de erro.
23
+
-`$fetchState.timestamp`: `Integer`, é um marcador de data e hora da última busca de dados, útil para armazenamento transitório com o `keep-alive`.
23
24
24
-
Se você quiser chamar o gatilho `fetch`a partir do seu modelo, use:
25
+
Se quisermos chamar a função gatilho `fetch` do nosso modelo de marcação de hipertexto, usamos:
25
26
26
27
```html
27
28
<button@click="$fetch">Refresh</button>
@@ -30,7 +31,7 @@ Se você quiser chamar o gatilho `fetch` a partir do seu modelo, use:
30
31
ou método de componente:
31
32
32
33
```javascript
33
-
//a partir de métodos de componente na secção de roteiro (script)
34
+
//dos métodos dos componentes na secção de programação.
34
35
exportdefault {
35
36
methods: {
36
37
refresh() {
@@ -40,15 +41,15 @@ export default {
40
41
}
41
42
```
42
43
43
-
Você pode acessar o [contexto](/docs/internals-glossary/context)do Nuxt dentro do gatilho `fetch` usando o`this.$nuxt.context`.
44
+
Podemos acessar o [contexto](/docs/internals-glossary/context)da Nuxt dentro da função gatilho `fetch` usando `this.$nuxt.context`.
44
45
45
46
### Opções
46
47
47
-
-`fetchOnServer`: `Boolean` ou `Function` (valor padrão: `true`), chama o `fetch()` quando o servidor estiver renderizando a página
48
-
-`fetchKey`: `String` ou `Function` (padroniza para identificador do escopo de componente ou nome de componente), uma chave (ou uma função que produz uma chave única) que identifica o resultado da requisição deste componente(disponível desde a versão 2.15 do Nuxt) [Mais informações estão disponíveis na PR original](https://github.com/nuxt/nuxt/pull/8466).
49
-
-`fetchDelay`: `Integer` (valor padrão: `200`), define em milissegundos o tempo mínimo de execução (para evitar piscadelas)
48
+
-`fetchOnServer`: `Boolean` ou `Function` (predefinida como: `true`), chama `fetch` quando a página é desenhada pelo servidor.
49
+
-`fetchKey`: `String` ou `Function` (a predefinição é o identificador do âmbito do componente ou o nome do componente), uma chave (ou uma função produz uma chave única) que identifica o resultado da pesquisa deste componente(disponível na Nuxt 2.15+) [Mais informações disponíveis no pedido de atualização do repositório original](https://github.com/nuxt/nuxt/pull/8466).
50
+
-`fetchDelay`: `Integer` (predefinida como: `200`), define o tempo mínimo de execução em milissegundos (para evitar intermitências rápidas).
50
51
51
-
Quando o`fetchOnServer`for falso (`false` ou retornar`false`), o `fetch` será chamado apenas no lado do cliente e o `$fetchState.pending` retornará `true` quando o servidor estiver renderizando o componente.
52
+
Quando a`fetchOnServer`é `false` ou retorna`false`, `fetch` será chamada apenas no lado do cliente e `$fetchState.pending` retornará `true` quando o componente for desenhado no servidor:
52
53
53
54
```html
54
55
<script>
@@ -62,19 +63,22 @@ Quando o `fetchOnServer` for falso (`false` ou retornar `false`), o `fetch` ser
// vários componentes podem retornar o mesmo `fetchKey` e o Nuxt rastreará ambos eles separadamente
66
+
// vários componentes podem retornar a mesma `fetchKey` e
67
+
// a Nuxt rastreará ambos separadamente
66
68
fetchKey:'site-sidebar',
67
-
// alternativamente, para mais controle, uma função pode ser passada com o acesso à instância do componente
68
-
// Ela será chamada dentro do gatilho `created` e não deve depender de um dado requisitado
69
+
// Em alternativa, para um maior controlo,
70
+
// pode ser passada uma função com acesso à instância do componente.
71
+
// Será chamada na `created` e não deve depender de dados obtidos.
69
72
fetchKey(getCounter) {
70
-
// `getCounter` é um método que pode ser chamado para receber o próximo número dentro de uma sequência
71
-
// como parte de geração de uma `fetchKey` única.
73
+
// `getCounter` é um método que pode ser chamada para
74
+
// obter o número seguinte numa sequência
75
+
// como parte da geração duma `fetchKey` única.
72
76
returnthis.someOtherData+getCounter('sidebar')
73
77
}
74
78
}
75
79
</script>
76
80
```
77
81
78
82
::alert{type="next"}
79
-
Para mais informações sobre o Gatilho Fetch consulte o capítulo [Requisição de Dados](/docs/features/data-fetching) no livro Funcionalidades
83
+
Para mais informações sobre a Função Gatilho `fetch`, consultar o capítulo de [Obtenção de Dados](/docs/features/data-fetching) no livro de Funcionalidades.
description: Observa as sequência de caracteres de consulta e executa os métodos do componente sobre as mudanças (asyncData, fetch, validate, layout, ...)
2
+
title: Propriedade de Observação de Consulta
3
+
description: Observa as sequências de caracteres da consulta e executa os métodos do componente em caso de alteração.
4
4
navigation.title: Propriedade WatchQuery
5
5
category: components-glossary
6
6
---
7
-
# A propriedade watchQuery
8
7
9
-
Watch query strings and execute component methods on change (asyncData, fetch, validate, layout, ...)
10
-
Observa as sequência de caracteres de consulta e executa os métodos do componente sobre as mudanças (asyncData, fetch, validate, layout, ...)
8
+
# Propriedade de Observação de Consulta
9
+
10
+
Observa as sequências de caracteres da consulta e executa os métodos do componente em caso de alteração (`asyncData`, `fetch`, `validate`, `layout`, ...).
11
11
12
12
---
13
13
14
-
-**Tipo:**`Boolean` ou `Array` ou `Function` (valor padrão: `[]`)
14
+
-**Tipo:**`Boolean` ou `Array` ou `Function` (predefinida como: `[]`)
15
15
16
-
Use a chave `watchQuery` para definir um observador para sequência de caracteres de consulta. Se a sequência de caracteres definida mudar, todos os métodos do componente (asyncData, fetch(context), validate, layout, ...) serão chamados. A observação está desativada por padrão para melhora de desempenho.
16
+
Usamos a chave `watchQuery` para definir um observador para as sequências de caracteres da consulta. Se as sequências de caracteres definidas mudarem, todos os métodos do componente (`async`, `fetch(context)`, `validate`, `layout`, ...) serão chamados. A observação está desativada por predefinição para melhorar o desempenho.
17
17
18
-
Se você quiser definir um observador para todas sequências de caracteres de consulta, defina`watchQuery: true`.
18
+
Se quisermos definir um observador para todas as sequências de caracteres da consulta, definimos`watchQuery: true`:
19
19
20
20
```js
21
21
exportdefault {
22
22
watchQuery: ['page']
23
23
}
24
24
```
25
25
26
-
Você pode também usar a função `watchQuery(newQuery, oldQuery)` para ter observadores mais refinados.
26
+
Também podemos usar a função `watchQuery(newQuery, oldQuery)` para termos observadores mais refinados:
27
27
28
28
```js
29
29
exportdefault {
30
30
watchQuery(newQuery, oldQuery) {
31
-
// Apenas execute os métodos do componente se sequência de caracteres de consulta antiga conter `bar`
32
-
// e a sequência de caracteres de consulta nova conter `conter`
31
+
// Só executa os métodos do componente se a sequência de
32
+
// caracteres de consulta antiga contiver `bar`
33
+
// e a nova sequência de caracteres de consulta contiver `foo`.
33
34
returnnewQuery.foo&&oldQuery.bar
34
35
}
35
36
}
36
37
```
37
38
38
39
::alert{type="warning"}
39
-
**Aviso**: O novo gatilho `fetch`introduzido na versão 2.12 não é afetado pelo`watchQuery`. Para mais informações consulte [ouvindo a mudanças na sequência de caracteres de consulta](/docs/features/data-fetching#o-gatilho-fetch).
40
+
**Aviso**: A nova função gatilho `fetch`introduzida na versão 2.12 não é afetada pela`watchQuery`. Para mais informações consultar [ouvir as alterações de sequência de caracteres de consulta](/docs/features/data-fetching#ouvir-as-alterações-da-sequência-de-caracteres-de-consulta).
Copy file name to clipboardExpand all lines: content/pt/docs/7.components-glossary/2.head.md
+9-7Lines changed: 9 additions & 7 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -1,18 +1,19 @@
1
1
---
2
-
title: O método head
3
-
description: O Nuxt usa vue-meta para atualizar os cabeçalhos e atributos do HTML da sua aplicação.
2
+
title: Método de Cabeçalho
3
+
description: A Nuxt utiliza a vue-meta para atualizar os cabeçalhos e os atributos da linguagem de marcação de hipertexto da nossa aplicação.
4
4
navigation.title: Método Head
5
5
category: components-glossary
6
6
---
7
-
# O método head
8
7
9
-
O Nuxt usa [vue-meta](https://github.com/nuxt/vue-meta) para atualizar os `cabeçalhos` e `atributos do HTML` da sua aplicação.
8
+
# Método de Cabeçalho
9
+
10
+
A Nuxt utiliza a [`vue-meta`](https://github.com/nuxt/vue-meta) para atualizar os **cabeçalhos** e os **atributos** da linguagem de marcação de hipertexto da nossa aplicação.
10
11
11
12
---
12
13
13
14
-**Tipo:**`Object` ou `Function`
14
15
15
-
Use o método `head` para definir os marcadores do cabeçalho do HTML para a página atual.
16
+
Usamos o método `head` para definir os marcadores do cabeçalho da linguagem de marcação de hipertexto `.html`para a página atual:
16
17
17
18
```html
18
19
<template>
@@ -30,7 +31,8 @@ Use o método `head` para definir os marcadores do cabeçalho do HTML para a pá
30
31
return {
31
32
title:this.title,
32
33
meta: [
33
-
// `hid` é usado como identificador único. Não use o `vmid` para isso visto que ele não funcionará
34
+
// `hid` é usado como identificador único.
35
+
// Não usamos `vmid` para sito, porque não funcionará.
34
36
{
35
37
hid:'description',
36
38
name:'description',
@@ -44,5 +46,5 @@ Use o método `head` para definir os marcadores do cabeçalho do HTML para a pá
44
46
```
45
47
46
48
::alert{type="info"}
47
-
Para evitar marcadores de meta duplicados quando usado em componente filho, definir um identificador único com a chave `hid` para os seus elementos de meta ([leia mais](https://vue-meta.nuxtjs.org/api/#tagidkeyname)).
49
+
Para evitar a duplicação de meta-marcadores quando utilizados num componente secundário (filho), configuramos um identificador único com a chave `hid` para os nossos meta-elementos ([ler mais](https://vue-meta.nuxtjs.org/api/#tagidkeyname)).
Copy file name to clipboardExpand all lines: content/pt/docs/7.components-glossary/3.key.md
+7-6Lines changed: 7 additions & 6 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -1,21 +1,22 @@
1
1
---
2
-
title: A propriedade key
3
-
description: Define a propriedade key do componente <router-view> interno
2
+
title: Propriedade Chave
3
+
description: Define a propriedade chave di componente interno <router-view>.
4
4
navigation:
5
5
title: Propriedade Key
6
6
category: components-glossary
7
7
---
8
-
# A propriedade key
9
8
10
-
Define a propriedade `key` do componente `<router-view>` interno
9
+
# Propriedade Chave
10
+
11
+
Define a propriedade `key` do componente interno `<router-view>`.
11
12
12
13
---
13
14
14
15
-**Tipo:**`String` ou `Function`
15
16
16
-
A propriedade `key` é propagada dentro do `<router-view>`, o qual é útil para realizar transições dentro de uma página dinâmica e rota diferente. Chaves diferentes resultam em re-renderização dos componentes de página.
17
+
A propriedade `key` é propagada para `<router-view>`, o que é útil para fazer transições dentro duma página dinâmica e uma rota dinâmica. Chaves diferentes resultam numa nova apresentação dos componente da página.
17
18
18
-
Há várias maneiras de definir a chave. Para mais detalhes, recorra a propriedade `nuxtChildKey`dentro do [componente nuxt](/docs/features/nuxt-components).
19
+
Existem várias maneiras de definir a chave. Para mais detalhes, consultar a propriedade `nuxtChildKey`nos [Componentes da Nuxt](/docs/features/nuxt-components):
Copy file name to clipboardExpand all lines: content/pt/docs/7.components-glossary/4.layout.md
+7-6Lines changed: 7 additions & 6 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -1,18 +1,19 @@
1
1
---
2
-
title: A propriedade layout
3
-
description: Todo ficheiro (primeiro nível) dentro do diretório layouts criará um esquema personalizado acessível com a propriedade layout dentro do componente de página.
2
+
title: Propriedade de Disposição
3
+
description: Cada ficheiro (primeiro nível) no diretório de disposições criará uma disposição personalizada acessível com uma propriedade de disposição no componente de página.
4
4
navigation.title: Propriedade Layout
5
5
category: components-glossary
6
6
---
7
-
# A propriedade layout
8
7
9
-
Todo ficheiro (primeiro nível) dentro do diretório layouts criará um esquema personalizado acessível com a propriedade layout dentro do componente de página.
8
+
# Propriedade de Disposição
9
+
10
+
Cada ficheiro (primeiro nível) no diretório `layouts` criará uma disposição personalizada acessível com uma propriedade `layout` no componente de página.
10
11
11
12
---
12
13
13
-
-**Tipo:**`String` ou `Function` (valor padrão: `'default'`)
14
+
-**Tipo:**`String` ou `Function` (predefinida como: `'default'`)
14
15
15
-
Use a chave `layout`dentro dos componentes de páginas para definir qual esquema usar:
16
+
Usamos a chave `layout`nos componentes das nossas páginas para definir a disposição a utilizar:
Copy file name to clipboardExpand all lines: content/pt/docs/7.components-glossary/5.loading.md
+8-7Lines changed: 8 additions & 7 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -1,21 +1,22 @@
1
1
---
2
-
title: A propriedade loading
3
-
description: A propriedade loading dá a você a opção de desativar a barra de progresso de carregamento padrão em uma página específica.
2
+
title: Propriedade de Carregamento
3
+
description: A propriedade de carregamento dá-nos a opção de desativar a barra de progresso de carregamento predefinida numa página específica.
4
4
navigation:
5
5
title: Propriedade Loading
6
6
category: components-glossary
7
7
---
8
-
# A propriedade loading
9
8
10
-
A propriedade `loading` dá a você a opção de desativar a barra de progresso de carregamento padrão em uma página específica.
9
+
# Propriedade de Carregamento
10
+
11
+
A propriedade `loading` dá-nos a opção de desativar a barra de progresso de carregamento predefinida numa página específica.
11
12
12
13
---
13
14
14
-
-**Tipo:**`Boolean` (valor padrão: `true`)
15
+
-**Tipo:**`Boolean` (predefinida como: `true`)
15
16
16
-
Por padrão, o Nuxt usa o seu próprio componente para mostrar uma barra de progresso entre as rotas.
17
+
Por predefinição, a Nuxt utiliza o seu próprio componente para mostrar a barra de progresso entre as rotas.
17
18
18
-
Você pode desativar ou personalizar ela globalmente através da [opção de configuração do loading](/docs/configuration-glossary/configuration-loading), mas também desativar ela para páginas específicas ao definir a propriedade `loading`para`false`:
19
+
Podemos desativá-la ou personalizá-la globalmente através da [opção `loading` da configuração](/docs/configuration-glossary/configuration-loading), mas também desativá-la para páginas específicas ao definir a propriedade `loading`como`false`:
Se você precisar usar um intermediário apenas para uma página específica, você pode usar diretamente uma função para isso (ou um arranjo de funções):
44
+
Se precisarmos de utilizar um intermediário apenas para uma página específica, podemos utilizar diretamente uma função para a mesma (ou um vetor de funções):
44
45
45
46
```html{}[pages/secret.vue]
46
47
<template>
@@ -50,7 +51,7 @@ Se você precisar usar um intermediário apenas para uma página específica, vo
0 commit comments