Summary of problems in the use of VUE

V-if is used to show and hide components of the same type (or dom tree of the same template)

###### Method 1: Add a different key to each V-if

<template v-if="type=== 'username'" key="1">  
  <label>The user name</label>  
  <input placeholder="Enter a user name">  
</template>  
<template v-else  key="2">  
  <label>email</label>  
  <input placeholder="Enter mailbox">  
</template>
Copy the code

###### Method 2: Use v-show instead

<template v-show="type=== 'username'">  
  <label>The user name</label>  
  <input placeholder="Enter a user name">  
</template>  
<template v-show="type=='good">  
  <label>email</label>  
  <input placeholder="Enter mailbox">  
</template>
Copy the code

###### use this. set when adding a property to an object, but there is no change on the view It must be used for object type to add new attributes to response, because the Vue cannot detect common new properties (such as this. MyObject. NewProperty = ‘hi’), you will find the Vue website is Vue set, Vue. Set the usage of the, give you insert links, afraid you can’t find 😁, Add a property to a reactive object and make sure the new property is also reactive and triggers view updates. It must be used for object type to add new attributes to response, because the Vue cannot detect common new properties (such as this. MyObject. NewProperty = ‘hi’), you will find the Vue website is Vue set, Vue. The use of the set, give you the link, In case you can’t find 😁, we’ll fix this. Set: Add a property to a reactive object and make sure the new property is also reactive and triggers view updates. It must be used for object type to add new attributes to response, because the Vue cannot detect common new properties (such as this. MyObject. NewProperty = ‘hi’), you will find the Vue website is Vue set, Vue. Set the usage of the, give you insert links, afraid you can’t find 😁, What does this this.set() have to do with it? $set(); $set();

This.$set(target, key, value)

🌹 target: Data source to change (object or array)

🌹 key: Specific data to be changed

🌹 value: indicates a new value

this.menulist[index].sonList.map((item) = >{
	this.$set(item, 'checked'.false); -- Assign vue set attribute})Copy the code