[feature/composition-api-intro] Translate composition api setup guide #10
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Tintef
force-pushed
the
feature/composition-api-setup
branch
from
efe1626
to
11ee5ea
Compare
lagp0310
reviewed
Nov 3, 2020
|
|
||
| > This guide assumes that you have already read the [Composition API Introduction](composition-api-introduction.html) and [Reactivity Fundamentals](reactivity-fundamentals.html). Read that first if you are new to Composition API. | ||
| > Esta guía asume que usted ya leyo la [Introducción de la API de Composición](composition-api-introduction.html) y [Fundamentos de la Reactividad](reactivity-fundamentals.html). Lea esto antes si usted es nuevo en lo que refiere a la API de Composición. |
There was a problem hiding this comment.
Suggested change
| > Esta guía asume que usted ya leyo la [Introducción de la API de Composición](composition-api-introduction.html) y [Fundamentos de la Reactividad](reactivity-fundamentals.html). Lea esto antes si usted es nuevo en lo que refiere a la API de Composición. | |
| > Esta guía asume que usted ya leyó la [Introducción de la API de Composición](composition-api-introduction.html) y [Fundamentos de la Reactividad](reactivity-fundamentals.html). Lea esto antes si usted es nuevo en lo que refiere a la API de Composición. |
lagp0310
reviewed
Nov 3, 2020
|
|
||
| 1. `props` | ||
| 2. `context` | ||
|
|
||
| Let's dive deeper into how each argument can be used. | ||
| Veamos en profundidad como se puede utilizar cada argumento. |
There was a problem hiding this comment.
Suggested change
| Veamos en profundidad como se puede utilizar cada argumento. | |
| Veamos en profundidad cómo se puede utilizar cada argumento. |
lagp0310
reviewed
Nov 3, 2020
| @@ -31,10 +31,10 @@ export default { | |||
| ``` | |||
|
|
|||
| :::warning | |||
| However, because `props` are reactive, you **cannot use ES6 destructuring** because it will remove props reactivity. | |||
| Sin embargo, dado que las `props` son reactivas, usted **no puede utilizar desestructuración de ES6** porque esto removera la reactividad de las mismas. | |||
There was a problem hiding this comment.
Suggested change
| Sin embargo, dado que las `props` son reactivas, usted **no puede utilizar desestructuración de ES6** porque esto removera la reactividad de las mismas. | |
| Sin embargo, dado que las `props` son reactivas, usted **no puede utilizar desestructuración de ES6** porque esto removerá la reactividad de las mismas. |
lagp0310
reviewed
Nov 3, 2020
| ::: | ||
|
|
||
| If you need to destructure your props, you can do this safely by utilizing the [toRefs](reactivity-fundamentals.html#destructuring-reactive-state) inside of the `setup` function. | ||
| Si usted necesita destrucutrar sus _props_, puede hacerlo de forma segura utilizando [toRefs](reactivity-fundamentals.html#destructuring-reactive-state) dentro de su función `setup`. |
There was a problem hiding this comment.
What do you thinks about this?
Suggested change
| Si usted necesita destrucutrar sus _props_, puede hacerlo de forma segura utilizando [toRefs](reactivity-fundamentals.html#destructuring-reactive-state) dentro de su función `setup`. | |
| Si usted necesita desestructurar sus _props_, puede hacerlo de forma segura utilizando [toRefs](reactivity-fundamentals.html#destructuring-reactive-state) dentro de su función `setup`. |
lagp0310
reviewed
Nov 3, 2020
| console.log(context.emit) | ||
| } | ||
| } | ||
| ``` | ||
|
|
||
| The `context` object is a normal JavaScript object, i.e., it is not reactive, this means you can safely use ES6 destructuring on `context`. | ||
| El objeto `context` es un objeto JavaScript común y corriento, es decir, no es reactivo, esto quiere decir que puede utilizar desestructuración de ES6 de forma segura sobre `context`. |
There was a problem hiding this comment.
Minor change 😄.
Suggested change
| El objeto `context` es un objeto JavaScript común y corriento, es decir, no es reactivo, esto quiere decir que puede utilizar desestructuración de ES6 de forma segura sobre `context`. | |
| El objeto `context` es un objeto JavaScript común y corriente, es decir, no es reactivo, esto quiere decir que puede utilizar desestructuración de ES6 de forma segura sobre `context`. |
lagp0310
reviewed
Nov 3, 2020
| @@ -80,26 +80,26 @@ export default { | |||
| } | |||
| ``` | |||
|
|
|||
| `attrs` and `slots` are stateful objects that are always updated when the component itself is updated. This means you should avoid destructuring them and always reference properties as `attrs.x` or `slots.x`. Also note that unlike `props`, `attrs` and `slots` are **not** reactive. If you intend to apply side effects based on `attrs` or `slots` changes, you should do so inside an `onUpdated` lifecycle hook. | |||
| `attrs` y `slots` son objetos que siempre son actualizados cuando la componente es actualizada. Esto quiere decir que usted debe evitar destructurarlos y siempre referenciar sus propiedades como `attrs.x` o `slots.x`. También tenga que cuenta que, a diferencia de `props`, `attrs` y `slots` **no** son reactivos. Si usted se ve tentado a invocar efectos secundarios basados en cambios en `attrs` o `slots`, usted debería realizarlo dentro del _hook_ del ciclo de vida `onUpdated`. | |||
There was a problem hiding this comment.
What do you think?
Suggested change
| `attrs` y `slots` son objetos que siempre son actualizados cuando la componente es actualizada. Esto quiere decir que usted debe evitar destructurarlos y siempre referenciar sus propiedades como `attrs.x` o `slots.x`. También tenga que cuenta que, a diferencia de `props`, `attrs` y `slots` **no** son reactivos. Si usted se ve tentado a invocar efectos secundarios basados en cambios en `attrs` o `slots`, usted debería realizarlo dentro del _hook_ del ciclo de vida `onUpdated`. | |
| `attrs` y `slots` son objetos que siempre son actualizados cuando el componente es actualizado. Esto quiere decir que usted debe evitar desestructurarlos y siempre referenciar sus propiedades como `attrs.x` o `slots.x`. También tenga que cuenta que, a diferencia de `props`, `attrs` y `slots` **no** son reactivos. Si usted se ve tentado a invocar efectos secundarios basados en cambios en `attrs` o `slots`, usted debería realizarlo dentro del _hook_ del ciclo de vida `onUpdated`. |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Description of Problem
None.
Proposed Solution
Translate
src/guide/composition-api-setup.mdAdditional Information
None.