처음부터 수동으로 사용자 정의 명령어를 캡슐화하는 것까지 16가지 Vue 명령어에 대해 알아보세요.

이 기사는 Vue 지침 및 사용자 정의 지침의 수동 캡슐화에 대한 관련 지식을 제공합니다. 도움이 되기를 바랍니다.

프런트엔드 기본 면접에서 Vue의 지시사항은 면접 질문이 많이 나오는 질문입니다

면접관이 물었습니다. Vue에는 어떤 지시사항이 있나요?

그에게 말해 보세요: Vue3.2부터 Vue에는 다음을 포함하여 총 16개의 내장 명령이 있습니다:

v-text, v-html, v-show, v-if, v-else, v-else -if, v-for, v-on, v-bind, v-model, v-slot, v-pre, v-cloak, v-once, v-memo, v-is, 여기서 v-memo는 새로운 항목입니다. 3.2 그런데 v-is는 3.1.0에서 더 이상 사용되지 않습니다

면접관이 추가로 질문하는 경우: 사용자 정의 명령을 캡슐화하는 방법은 무엇입니까?

그에게 말하세요: 사용자 정의 명령어는 전역 사용자 정의 명령어와 로컬 명령어로 구분됩니다. Vue3에서는 애플리케이션 인스턴스에서 directive()를 통해 전역 사용자 정의 명령어를 등록할 수 있습니다. 로컬 명령어를 등록하려면 이를 구성하면 됩니다. 로컬 지시어를 등록하는 컴포넌트 지시어 옵션

이 기사를 읽고 나면 16가지 Vue 지시어를 포괄적으로 이해하고 지시어를 사용자 정의하는 방법을 익힐 수 있습니다.

1. 소개

1.1 Vue 지시어란 무엇입니까?

Vue에서는 지시문 사실 특별한 속성입니다

Vue는 지시에 따라 뒤에서 뭔가를 할 것입니다. 구체적으로 무엇을 해야 할지에 대해서는 Vue가 다른 지시에 따라 다른 작업을 수행할 것이라고 이야기하겠습니다.

1.2

의 특징은 나중에 설명하겠습니다.

Vue 명령어의 분명한 특징은 모두 v-로 시작한다는 것입니다. 예: v-text

<span v-text="msg"></span>

2.

2.1 Vue에 내장된 지침은 무엇입니까

내장 지침은 Vue를 참조합니다. 내장 명령이 포함되어 있어 즉시 사용할 수 있습니다.

Vue에는 총 16개의 내장 명령이 있습니다. 다음을 포함한 명령:

v-text, v-html, v-show, v-if, v-else, v-else-if, v-for, v-on, v-bind, v-model, v- Slot, v-pre, v-cloak, v-once, v-memo, v-is 중 v-memo는 3.2에서 새로 추가되었고, v-is는 3.1.0에서 사라졌습니다

기본적인 사용법에 대해 알아보겠습니다. 이러한 내장 명령어

2.2 16개의 내장 명령어의 기본 사용법을 이해하세요

2.2.1 v-text

v -text의 역할은 요소의 textContent를 업데이트하는 것입니다. 예:

<h1 v-text="msg"></h1>

h1 요소의 내용은 궁극적으로 msg의 값에 따라 달라집니다

2.2.2 v-html

은 v-text와 매우 유사합니다. v-html만 업데이트하는 데 사용됩니다.

<div v-html="&#39;<h1>Hello LBJ</h1>&#39;"></div>

와 같은 요소의 innerHTML 내부 콘텐츠는 일반 HTML로 삽입되어야 한다는 점에 유의해야 합니다.

2.2.3 v-show

v-show는 표현식을 기반으로 할 수 있습니다. 요소의 표시 값을 전환하는 false 값은 요소의 표시 및 숨기기를 제어하는 ​​데 사용됩니다. 예:

조건이 변경되면 이 명령이 표시 또는 숨기기의 전환 효과를 트리거하는 것을 볼 수 있습니다.

참고: v -show는