Review on guide/reactivity-fundamentals

Author: GuiDevloper

src/guide/reactivity-fundamentals.md

@@ -1,6 +1,6 @@
-# Fundamentos de Reatividade
+# Fundamentos da Reatividade
 
-## Declaração de Estado Reativo
+## Declarando Estado Reativo
 
 Para criar um estado reativo a partir de um objeto JavaScript, podemos usar o método `reactive`:
 
@@ -13,17 +13,17 @@ const state = reactive({
 })
 ```
 
-`reactive` é o equivalente a `Vue.observable()` da API no Vue 2.x, renomeado para evitar confusoes com os observables RxJS. Aqui, o estado retornado é um objeto reativo. A conversão reativa é "profunda" - ela afeta todas as propriedades aninhadas do objeto passado.
+`reactive` é equivalente à API `Vue.observable()` do Vue 2.x, renomeado para evitar confusões com os `Observables` do RxJS. Aqui, o estado retornado é um objeto reativo. A conversão reativa é "profunda" - ela afeta todas as propriedades aninhadas do objeto passado.
 
 O caso de uso essencial para o estado reativo no Vue é que podemos usá-lo durante a renderização. Graças ao rastreamento de dependência, a exibição é atualizada automaticamente quando o estado reativo muda.
 
-Esta é a própria essência do sistema de reatividade do Vue. Quando você retorna um objeto de `data()` em um componente, ele é tornado reativo internamente pelo `reactive()`. O modelo é compilado em uma [função de renderização](render-function.html) que faz uso dessas propriedades reativas.
+Esta é a própria essência do sistema de reatividade do Vue. Quando você retorna um objeto de `data()` em um componente, ele é tornado reativo internamente pelo `reactive()`. O _template_ é compilado em uma [função de renderização](render-function.html) que faz uso dessas propriedades reativas.
 
-Você pode aprender mais sobre `reactive` na seção [API de reatividade básica](../api/basic-reactivity.html)
+Você pode aprender mais sobre `reactive` na seção [Básico da API de Reatividade](../api/basic-reactivity.html)
 
-## Criação de Valores Reativos Autônomos como `refs`
+## Criação de Valores Reativos Avulsos como `refs`
 
-Imagine o caso em que temos um valor primitivo autônomo (por exemplo, uma string) e queremos torná-la reativa. Claro, poderíamos fazer um objeto com uma única propriedade igual à nossa string e passá-la para `reactive`. Vue tem um método que fará o mesmo para nós - ele é o `ref`:
+Imagine o caso em que temos um valor primitivo avulso (por exemplo, uma string) e queremos torná-la reativa. Claro, poderíamos fazer um objeto com uma única propriedade igual à nossa string e passá-la para `reactive`. Vue tem um método que fará o mesmo para nós - ele é o `ref`:
 
 ```js
 import { ref } from 'vue'
@@ -45,13 +45,13 @@ console.log(count.value) // 1
 
 ### Ref Desempacotada
 
-Quando um ref é retornado como uma propriedade no contexto de renderização (o objeto retornado de [setup()](composition-api-setup.html)) e acessado no modelo, ele se desempacota automaticamente para o valor interno. Não há necessidade de anexar `.value` no modelo:
+Quando um `ref` é retornado como uma propriedade no contexto de renderização (o objeto retornado de [setup()](composition-api-setup.html)) e acessado no _template_, ele se desempacota automaticamente para o valor interno. Não há necessidade de anexar `.value` no _template_:
 
 ```vue-html
 <template>
   <div>
     <span>{{ count }}</span>
-    <button @click="count ++">Incrementar contador</button>
+    <button @click="count++">Incrementar contador</button>
   </div>
 </template>
 
@@ -68,7 +68,7 @@ Quando um ref é retornado como uma propriedade no contexto de renderização (o
 </script>
 ```
 
-### Acesso em objetos Reativos
+### Acesso em Objetos Reativos
 
 Quando um `ref` é acessado ou alterado como uma propriedade de um objeto reativo, ele se desempacota automaticamente para o valor interno para que se comporte como uma propriedade normal:
 
@@ -84,7 +84,7 @@ state.count = 1
 console.log(count.value) // 1
 ```
 
-Se uma nova ref for atribuída a uma propriedade vinculada a uma ref existente, ela substituirá a antiga ref:
+Se uma nova `ref` for atribuída à uma propriedade vinculada à uma `ref` existente, ela substituirá a antiga ref:
 
 ```js
 const otherCount = ref(2)
@@ -94,30 +94,30 @@ console.log(state.count) // 2
 console.log(count.value) // 1
 ```
 
-O desempacotamento de um ref só acontece quando aninhado dentro de um `Object` reativo. Não há desempacotamento executado quando o ref é acessado de um `Array` ou um tipo de coleção nativo como [`Map`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map):
+O desempacotamento de um `ref` só acontece quando aninhado dentro de um `Object` reativo. Não há desempacotamento executado quando o `ref` é acessado de um `Array` ou um tipo de coleção nativo como [`Map`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map):
 
 ```js
-const books = reactive([ref('Vue 3 Guide')])
-// precisa utilizar .value aqui
+const books = reactive([ref('Guia do Vue 3')])
+// precisa usar .value aqui
 console.log(books[0].value)
 
 const map = reactive(new Map([['count', ref(0)]]))
-// precisa utilizar .value aqui
+// precisa usar .value aqui
 console.log(map.get('count').value)
 ```
 
 ## Desestruturar Estado Reativo
 
-Quando queremos usar algumas propriedades do grande objeto reativo, pode ser tentador usar [ES6 desestruturação](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment) para obter as propriedades que desejamos:
+Quando queremos usar algumas propriedades do grande objeto reativo, pode ser tentador usar [desestruturação do ES6](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment) para obter as propriedades que desejamos:
 
 ```js
 import { reactive } from 'vue'
 
 const book = reactive({
   author: 'Equipe Vue',
   year: '2020',
-  title: 'Guia para Vue 3',
-  description: 'Você está lendo está documentação agora ;)',
+  title: 'Guia do Vue 3',
+  description: 'Você está lendo esta documentação agora ;)',
   price: 'grátis'
 })
 
@@ -130,24 +130,24 @@ Infelizmente, com tal desestruturação, a reatividade para ambas as propriedade
 import { reactive, toRefs } from 'vue'
 
 const book = reactive({
-  author: 'Vue Team',
+  author: 'Equipe Vue',
   year: '2020',
-  title: 'Vue 3 Guide',
-  description: 'You are reading this book right now ;)',
-  price: 'free'
+  title: 'Guia do Vue 3',
+  description: 'Você está lendo esta documentação agora ;)',
+  price: 'grátis'
 })
 
 let { author, title } = toRefs(book)
 
-title.value = 'Guia detalhado do Vue 3' // precisamos usar .value porque o título é uma referência agora
+title.value = 'Guia detalhado do Vue 3' // precisamos usar .value porque `title` é uma `ref` agora
 console.log(book.title) // 'Guia detalhado do Vue 3'
 ```
 
-Você pode aprender mais sobre `refs` na seção [Refs API](../api/refs-api.html#ref)
+Você pode aprender mais sobre `refs` na seção [API de Refs](../api/refs-api.html#ref)
 
-## Evite a Mutação de Objetos Reativos com `readonly`
+## Evite Mutar Objetos Reativos com `readonly`
 
-Às vezes, queremos rastrear as alterações do objeto reativo (`ref` ou` reactive`), mas também queremos evitar alterá-la de um determinado local do aplicativo. Por exemplo, quando temos um objeto reativo [provided](component-give-inject.html), queremos evitar a sua mutação onde ele é injetado. Para fazer isso, podemos criar um proxy somente leitura (readonly) para o objeto original:
+Às vezes, queremos rastrear as alterações do objeto reativo (`ref` ou` reactive`), mas também queremos evitar alterá-lo de um determinado local do aplicativo. Por exemplo, quando temos um objeto reativo [provido](component-provide-inject.html), queremos evitar a sua mutação onde ele é injetado. Para fazer isso, podemos criar um _proxy_ somente leitura (readonly) para o objeto original:
 
 ```js
 import { reactive, readonly } from 'vue'