diff --git a/src/guide/essentials/list.md b/src/guide/essentials/list.md
index 03fcc73238..81c79895e5 100644
--- a/src/guide/essentials/list.md
+++ b/src/guide/essentials/list.md
@@ -1,8 +1,8 @@
-# List Rendering
+# Render danh sách
## `v-for`
-We can use the `v-for` directive to render a list of items based on an array. The `v-for` directive requires a special syntax in the form of `item in items`, where `items` is the source data array and `item` is an **alias** for the array element being iterated on:
+Chúng ta có thể dùng chỉ thị `v-for` để render một danh sách các mục dựa trên một mảng. Chỉ thị `v-for` yêu cầu một cú pháp đặt biệt trong dạng `item in items`, với `items` là một mảng chứa dữ liệu và `item` là một **biệt danh** cho phần tử của mảng được lặp lại:
@@ -30,7 +30,7 @@ data() {
```
-Inside the `v-for` scope, template expressions have access to all parent scope properties. In addition, `v-for` also supports an optional second alias for the index of the current item:
+Bên trong ngữ cảnh `v-for`, biểu thứ template có quyền truy cập vào tất cả thuộc tính trong ngữ cảnh cha của nó. Hơn nữa, `v-for` còn hỗ trợ một biểu thức phụ thuộc cho phần tử hiện tại của mảng:
@@ -82,6 +82,8 @@ const items = [{ message: 'Foo' }, { message: 'Bar' }]
The variable scoping of `v-for` is similar to the following JavaScript:
+Phạm vi giá trị của `v-for` cũng tương tự như trong đoạn JavaScript sau:
+
```js
const parentMessage = 'Parent'
const items = [
@@ -97,6 +99,8 @@ items.forEach((item, index) => {
Notice how the `v-for` value matches the function signature of the `forEach` callback. In fact, you can use destructuring on the `v-for` item alias similar to destructuring function arguments:
+Để ý cách giá trị `v-for` khớp với hình thức của function callback của `forEach`. Thực ra, bạn có thể sử dụng cú pháp phân rã cho phần tử trong `v-for` tương tự như phân rã các tham số của function:
+
```vue-html
{{ message }}
@@ -110,6 +114,8 @@ Notice how the `v-for` value matches the function signature of the `forEach` cal
For nested `v-for`, scoping also works similar to nested functions. Each `v-for` scope has access to parent scopes:
+Ngữ cảnh củua các `v-for` lồng nhau cũng tương tự như các function lồng nhau. Mỗi ngữ cảnh của `v-for` có quyền truy cập vào ngữ cảnh cha của nó:
+
```vue-html
@@ -120,6 +126,8 @@ For nested `v-for`, scoping also works similar to nested functions. Each `v-for`
You can also use `of` as the delimiter instead of `in`, so that it is closer to JavaScript's syntax for iterators:
+Bạn cũng có thể dùng `of` thay cho `in`, như vậy nó sẽ gần với cú pháp của JavaScript hơn:
+
```vue-html
```
@@ -128,6 +136,8 @@ You can also use `of` as the delimiter instead of `in`, so that it is closer to
You can also use `v-for` to iterate through the properties of an object.
+Bạn cũng có thể sử dụng `v-for` để duyệt qua các thuộc tính của một object:
+
```js
@@ -165,6 +175,8 @@ data() {
You can also provide a second alias for the property's name (a.k.a. key):
+Bạn còn có thể cung cấp một alia thứ hai đại diện cho tên của thuộc tính (hay key):
+
```vue-html
{{ key }}: {{ value }}
@@ -173,6 +185,8 @@ You can also provide a second alias for the property's name (a.k.a. key):
And another for the index:
+Và một cái khác cho index:
+
```vue-html
{{ index }}. {{ key }}: {{ value }}
@@ -192,6 +206,8 @@ And another for the index:
:::tip Note
When iterating over an object, the order is based on the enumeration order of `Object.keys()`, which isn't guaranteed to be consistent across JavaScript engine implementations.
+
+Khi duyệt qua một object, thứ tự được dựa trên thứ tự của tập `Object.keys()`, cái mà không chắc rằng sẽ thống nhất giữa các engine Javascript khác nhau.
:::
## `v-for` with a Range