Vue study notes "continuously updated"

(1) el mount point: 
1. What is the scope of the Vue instance? 
Vue will manage the element hit by the el option and its descendant elements 
2. Is it possible to use other selectors? 
Other selectors can be used, but ID selector 
3 is recommended. Is it possible to set other dom elements? 
Other double tags can be used, but HTML and BODY cannot be used 


(2) v-text 
1. Function: Set the content of the tag 
2. The default writing method will replace all the content, and the difference expression { 
  
  {}} can be used to replace the specified content 
(3 )v-show 
1. Function: switch the display state 
of elements according to 
true and 
false Hide the false element 
5. After the data is changed, the display state of the corresponding element will be updated synchronously 


(4) v-if 
1. Function: switch the display state of the element according to the true or false of the expression 
2. Essence: switch the display by operating the dom element Status 
3. The value is true, the element element exists in the dom tree, the value is false, and it is removed from the dom tree 
4. Frequent switching of v-show, otherwise, v-if is used, and the switching consumption of the former is small 


(5) v-bind 
1 .Instruction: Bind attributes to elements 
2. Writing: v-bind: attribute name 
3. In shorthand, you can omit v-bind directly, only keep: attribute name 
4.** Need to dynamically add or delete classes It is recommended to use objects


(6) v-for: 
1. Function: Generate a list structure based on data 
2. Arrays are often used in combination with for 
3. The syntax is (item, index) in data 
4. Item and index can be used in conjunction with other instructions 
5. Arrays Updates are synced to the page and are responsive. 


(7) v-model 
1. Two-way binding 
v-model 


// Syntactic sugar: also translated as sugar-coated syntax, mainly for the convenience of programmers. Generally speaking, the use of syntactic sugar can increase the readability of the program, thereby reducing the program code Chance to go wrong.

Guess you like

Origin blog.csdn.net/weixin_60789461/article/details/123390337