Sintaxe da diretiva de sintaxe do modelo

Sintaxe da diretiva de sintaxe do modelo - 02

2024-07-12

//Sintaxe da instrução:

1. O que é designação e o que ela faz?

A responsabilidade da diretiva é aplicar os efeitos associados à ação responsiva DOM quando o valor da expressão muda.

2. Os nomes de todas as instruções na estrutura vue começam com v-

3. A interpolação está escrita na etiqueta e as instruções estão escritas em

Todas as instruções na caixa vue existem na forma de atributos da tag HTML.

Por exemplo: <span 指令写在这 >{</span>{Aqui está a localização da sintaxe de interpolação}}

Nota: Embora a instrução esteja escrita na posição do atributo da tag, o navegador não consegue entender este comando. Ele precisa primeiro ser compilado pela estrutura vue.

4. Regras gramaticais de instruções

Um formato de sintaxe para instruções

<HTML 标签 v-指令名：参数 = “表达式”></HTML>

expressão, anteriormente na sintaxe de interpolação { {O que pode ser escrito aqui}}, então o que pode ser escrito na expressão da instrução é exatamente o mesmo. Entretanto, deve-se notar que { não pode ser adicionado fora da posição da expressão na instrução.{}}

Nem todas as instruções possuem parâmetros e expressões

Algumas instruções não requerem parâmetros ou expressões. Exemplo: v-once.

Algumas instruções não requerem parâmetros, mas requerem expressões, por exemplo: v-if = "expression"

Algumas instruções requerem parâmetros e expressões. Por exemplo: v-bind: parâmetro = "expressão"

diretiva v-once

Função: renderize o elemento apenas uma vez e depois renderize-o novamente. O elemento e todos os seus nós filhos serão colocados na memória estática e ignorados.

diretiva v-if = "expressão"

Função: O resultado da execução da expressão requer um dado do tipo booleano: verdadeiro ou falso

true: A tag onde esta instrução está localizada será renderizada para o navegador.

false: A tag onde esta diretiva está localizada não será renderizada para o navegador.

<body>

<h1>{{mensagem}}</h1/>

<h1 v-once>{{mensagem}}</h1>

<h1 v-if="a>b"> teste:{{mensagem}}</h1>

</div>

novo Vue （{

el : '#app'

dados(){

mensagem: ' qwert'

a: ' 20'

b: '21'

}

}）

</scirpt>

</body>

Compartilhamento de tecnologia

Sintaxe da diretiva de sintaxe do modelo - 02

Perfil pessoal

minhas informações de contato