# Vue built-in instruction of front end

2022-04-29 05:12:28

v-bind
v-model
v-on
v-show
v-if
v-for

# v-text

No resolution html label , Replace the text in the label with the full text string

still { { }} To use

# v-html

Can parse html label

cookie（ Data stored on the user's local terminal ）

# v-cloak

There is no property name .

Usage method

When the page network is slow , The page is still loading Vue.js, hide Vue Too late to render , Delete... When loading is complete v-cloak attribute , present Vue Rendered page .

# v-once

There is no property name .

effect : After the first rendering , No longer re rendering as data changes

# v-pre

v- pre Can be used to prevent precompiling , Yes v- pre The contents inside the tag of the instruction will not be compiled , It will output as is .
Do not add... To labels with instructions or interpolation syntax v-pre, Vue Can't handle it and use it directly .

# Custom instruction

vue Instructions are actually native operations dom It was packaged .
Callback function of all instructions this All are Window
You can only give yourself Vue Case use , The instruction to become a global variable needs to be written in the following figure

Naming format :
1. When the instruction name has more than one word , Words are separated by a dash . Include the instruction name in single quotation marks

The definition of location is :

directives:{
//  Define custom instructions
}


Two ways to customize instructions :

## Functional expression :

The cases of calling instructions are
1. Upon successful binding
2. Template re parsing

element Are elements that use instructions
binding Instruction bound data

## Object time :

Ability to specify different lifecycles
fbind Is a custom instruction name , Write when using v-fbind
The inner function name cannot be , Just write

summary :