Vue Learning 13: List Rendering of Vue

<!-- A unique key value, it is not recommended to use index, because it will consume a lot of performance. Generally, ID -->

<div v-for="(item, index) of list" key = "id">
      {{item.text}} -----> {{index}}
</div>

How to make the array change?

Method 1: Modify through the vue mutation method

Method 2: Change the reference of list


Template placeholders can be used to wrap and not render to the page when rendering. This is the role of template placeholders.


object loop

<div v-for="(item, key, index) of userInfo">{{item}}-->{{key}}-->{{index}}</div>

item is the value, key is the key, and index is the subscript.

How to modify it?

vm.userInfo.name = "Dell Lee";

How to add it? Modify citations.

vm.userInfo=

{
name: 'Dell',
age: 28,
gender: 'male',
salary: 'secret', aaa: 'bbb' this item is added

}

But is this modification method too cumbersome?

Look at the set method of the object:


Please see the set method of the array:



Guess you like

Origin http://43.154.161.224:23101/article/api/json?id=325830464&siteId=291194637