기술나눔

템플릿 구문 지시어 구문 - 02

2024-07-12

한어Русский языкEnglishFrançaisIndonesianSanskrit日本語DeutschPortuguêsΕλληνικάespañolItalianoSuomalainenLatina

//명령 구문:

1. 지정이란 무엇이며 어떤 역할을 합니까?

지시문의 역할은 표현식 값이 변경될 때 반응형 작업 DOM에 관련 효과를 적용하는 것입니다.

2. vue 프레임워크의 모든 명령어 이름은 v-로 시작합니다.

3. 보간법은 라벨에 적혀 있고, 명령어는

Vue 상자의 모든 지침은 Html 태그의 속성 형태로 존재합니다.

예를 들어: <span 指令写 在这 >{</span>{보간 구문의 위치는 다음과 같습니다}}

참고: 명령이 태그의 속성 위치에 작성되어 있지만 브라우저는 이 명령을 이해할 수 없습니다. 먼저 vue 프레임워크에서 컴파일해야 합니다. 컴파일된 내용은 브라우저에서 볼 수 있습니다.

4. 지시의 문법 규칙

명령어의 구문 형식

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

이전에 보간 구문에 있었던 표현식 {여기에 쓸 수 있는 내용}}, 그러면 명령어의 표현식에 쓸 수 있는 내용은 실제로 완전히 동일합니다. 그러나 명령어의 표현식 위치 외부에는 {를 추가할 수 없다는 점에 유의해야 합니다.{}}

모든 명령어에 매개변수와 표현식이 있는 것은 아닙니다.

일부 명령어에는 매개변수나 표현식이 필요하지 않습니다. 예: v-once

일부 명령어에는 매개변수가 필요하지 않지만 표현식이 필요합니다. 예: v-if = "expression"

일부 명령에는 매개변수와 표현식이 모두 필요합니다. 예: v-bind: 매개변수 = "표현식"

  1. v-once 지시어

기능: 요소를 한 번만 렌더링한 다음 다시 렌더링합니다. 요소와 해당 하위 노드는 모두 정적 메모리에 배치되고 건너뛰어 업데이트 성능을 최적화할 수 있습니다.

  1. v-if = "표현식" 지시어

기능: 표현식의 실행 결과에는 부울 유형 데이터가 필요합니다: true 또는 false

true: 이 명령어가 있는 태그가 브라우저에 렌더링됩니다.

false: 이 지시어가 있는 태그는 브라우저에 렌더링되지 않습니다.

<body>

<div id ='app'>

<h1>{{메시지}}</h1/>

<h1 v-once>{{메시지}}</h1>

<h1 v-if="a>b"> 시험:{{메시지}}</h1>

</div>

<script>

새로운 Vue ({

el : '#앱'

데이터(){

메시지 : ' qwert'

가 : ' 20'

나 : ' 21'

}

})

</scirpt>

</body>