Skip to content

Commit 99085c1

Browse files
committed
[REFACTOR]: Applies requested changes
1 parent adbc32d commit 99085c1

File tree

1 file changed

+11
-12
lines changed

1 file changed

+11
-12
lines changed

src/content/learn/importing-and-exporting-components.md

Lines changed: 11 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -1,26 +1,26 @@
11
---
2-
title: Importando e Exportando componentes
2+
title: Importando e Exportando Componentes
33
---
44

55
<Intro>
66

7-
A magia dos componentes reside na sua reutilização: você pode criar um componente que é composto por outros componentes. Mas conforme você aninha mais e mais componentes, faz sentido começar a dividi-los em arquivos diferentes. Isso permite que você mantenha seus arquivos fáceis de explorar e reutiliza-los em mais lugares.
7+
A magia dos componentes reside na sua habilidade de reutilização: você pode criar um componente que é composto por outros componentes. Mas conforme você aninha mais e mais componentes, faz sentido começar a dividi-los em arquivos diferentes. Isso permite que você mantenha seus arquivos fáceis de explorar e reutiliza-los em mais lugares.
88

99
</Intro>
1010

1111
<YouWillLearn>
1212

1313
* O que é um arquivo de componente raiz
1414
* Como importar e exportar um componente
15-
* Quando usar importações e exportações padrão e nomeada
16-
* Como importar e exportar múltiplos componentes em um arquivo
15+
* Quando usar importações e exportações padrão (`default`) e nomeada
16+
* Como importar e exportar múltiplos componentes em um arquivo
1717
* Como separar componentes em múltiplos arquivos
1818

1919
</YouWillLearn>
2020

2121
## O arquivo de componente raiz {/*the-root-component-file*/}
2222

23-
Em [Seu primeiro componente](/learn/your-first-component), você criou um componente `Profile` e um componente `Gallery` que renderiza:
23+
Em [Seu Primeiro Componente](/learn/your-first-component), você criou um componente `Profile` e um componente `Gallery` que renderiza:
2424

2525
<Sandpack>
2626

@@ -108,10 +108,10 @@ Observe como este exemplo é dividido em dois arquivos de componentes agora:
108108

109109
1. `Gallery.js`:
110110
- Define o componente `Profile` que é usado apenas dentro do mesmo arquivo e não é exportado.
111-
- Exporta o componente `Gallery` como uma **exportação padrão.**
111+
- Exporta o componente `Gallery` como uma **(default export).**
112112
2. `App.js`:
113113
- Importa `Gallery` como uma **importação padrão** de `Gallery.js`.
114-
- Exporta o componente raiz `App` como uma **exportação padrão.**
114+
- Exporta o componente raiz `App` como uma **exportação padrão (default export).**
115115

116116

117117
<Note>
@@ -143,14 +143,13 @@ A forma como você exporta seu componente determina como você deve importá-lo.
143143

144144
Quando você escreve uma importação _padrão_, você pode colocar o nome que quiser depois de `import`. Por exemplo, você poderia escrever `import Banana from './Button.js'` e ainda forneceria a mesma exportação padrão. Por outro lado, com importações nomeadas, o nome deve corresponder em ambos os lados. É por isso que eles são chamados de importações _nomeadas_!
145145

146-
**Os usuários costumam usar exportações padrão se o arquivo exportar apenas um componente e usar exportações nomeadas se exportar vários componentes e valores.**
147-
Independentemente de qual estilo de código você preferir, sempre forneça nomes significativos para as funções do componente e os arquivos que os contêm. Componentes sem nomes, como `export default () => {}`, são desencorajados porque dificultam a depuração.
146+
**Os usuários costumam usar exportações padrão se o arquivo exportar apenas um componente e usar exportações nomeadas se exportar vários componentes e valores.** Independentemente de qual estilo de código você preferir, sempre forneça nomes significativos para as funções do componente e os arquivos que os contêm. Componentes sem nomes, como `export default () => {}`, são desencorajados porque dificultam a depuração.
148147

149148
</DeepDive>
150149

151150
## Exportando e importando múltiplos componentes no mesmo arquivo {/*exporting-and-importing-multiple-components-from-the-same-file*/}
152151

153-
E se você quiser mostrar apenas um `Profile` em vez de uma galeria? Você também pode exportar o componente `Profile`. Mas `Gallery.js` já tem uma exportação *padrão* e você não pode ter _duas_ exportações padrão. Você pode criar um novo arquivo com uma exportação padrão ou adicionar uma exportação *nomeada* para `Profile`. **Um arquivo pode ter apenas uma exportação padrão, mas pode ter várias exportações nomeadas!**
152+
E se você quiser mostrar apenas um `Profile` em vez de uma galeria? Você também pode exportar o componente `Profile`. Mas `Gallery.js` já tem uma exportação *padrão* e você não pode ter _duas_ exportações padrão. Você poderia criar um novo arquivo com uma exportação padrão ou adicionar uma exportação *nomeada* para `Profile`. **Um arquivo pode ter apenas uma exportação padrão, mas pode ter várias exportações nomeadas!**
154153

155154
<Note>
156155

@@ -239,8 +238,8 @@ Nessa pagina você aprendeu:
239238

240239
* O que é um arquivo de componente raiz
241240
* Como importar e exportar um componente
242-
* Quando e como usar importações e exportações padrão e nomeada
243-
* Como exportar múltiplos componentes em um arquivo
241+
* Quando e como usar importações e exportações padrão e nomeada
242+
* Como exportar múltiplos componentes em um arquivo
244243

245244
</Recap>
246245

0 commit comments

Comments
 (0)