>웹 프론트엔드 >프런트엔드 Q&A >vuejs는 API인가요?

vuejs는 API인가요?

青灯夜游
青灯夜游원래의
2021-09-27 19:15:381637검색

vuejs는 API가 아닙니다. vuejs는 웹 개발을 더 잘 구성하고 단순화하도록 설계된 사용자 인터페이스 구축을 위한 진보적인 JavaScript 프레임워크입니다. API는 애플리케이션과 개발자에게 특정 소프트웨어나 하드웨어를 기반으로 하는 일련의 루틴에 액세스할 수 있는 기능을 제공하는 사전 정의된 기능 세트인 애플리케이션 프로그래밍 인터페이스를 나타냅니다.

vuejs는 API인가요?

이 튜토리얼의 운영 환경: Windows 7 시스템, vue 버전 2.9.6, DELL G3 컴퓨터.

vuejs는 API가 아닙니다.

Vue(/vjuː/로 발음, view와 유사)는 웹 개발을 더 잘 구성하고 단순화하도록 설계된 사용자 인터페이스 구축을 위한 진보적인 JavaScript 프레임워크입니다. 다른 대형 프레임워크와 달리 Vue는 아래에서 위로 레이어별로 적용되도록 설계되었습니다.

Vue의 핵심 라이브러리는 시작하기 쉬울 뿐만 아니라 타사 라이브러리 또는 기존 프로젝트와 쉽게 통합할 수 있는 뷰 레이어에만 중점을 둡니다. 반면, 최신 도구 체인 및 다양한 지원 라이브러리와 결합하면 Vue는 복잡한 단일 페이지 애플리케이션(SPA)용 드라이버를 완벽하게 제공할 수 있습니다.

Vue.js는 또한 간단하고 유연한 API를 사용하여 MVVM 데이터 바인딩 및 구성 가능한 구성 요소 시스템을 제공합니다. 그 목표는 가능한 가장 간단한 API를 통해 반응형 데이터 바인딩 및 구성 가능한 뷰 구성 요소를 달성하는 것입니다.

그리고 API(애플리케이션 프로그래밍 인터페이스, 애플리케이션 프로그래밍 인터페이스)는 미리 정의된 일부 기능이며, 그 목적은 애플리케이션과 개발자에게 소스 코드에 액세스하지 않고도 특정 소프트웨어나 하드웨어를 기반으로 하는 일련의 루틴에 액세스할 수 있는 기능을 제공하는 것입니다. 내부 동작의 세부 사항을 이해합니다.

vuejs의 일부 API

vm은 new Vue

에서 얻은 인스턴스를 참조합니다. (1) dom 태그의 값이 data의 값에 바인딩되면 data에 해당하는 값을 변경하여 업데이트할 수 있습니다. 실시간 값의 태그

그러나 이후에 추가된 값은 유효하지 않습니다(바인딩 실패).

(2) 객체는 데이터의 속성으로 직접 사용될 수 있습니다. 이는 객체가 값으로 전달되기 때문에 유효합니다.

따라서 속성과 객체는 일치합니다.

(3) VM의 인터페이스

vm.$data는 vm의 데이터 속성입니다.

vm.$el은 el 속성이 가리키는 dom 노드입니다.

vm.$watch는 데이터의 값과 같은 속성 변경을 모니터링하는 것입니다. ((9) 참조)

(4) vue 인스턴스의 선언 주기에는 여러 가지 주요 함수가 있습니다.

created: 이벤트 바인딩이 완료된 후 해당 함수는 다음과 같은 경우 vue 인스턴스에서 속성으로 직접 사용됩니다. vue 인스턴스를 선언하는 것은 아래와 같습니다.

vm.$mount: dom 노드 마운트

beforeCompile: 템플릿 로드 전

ready: 완료 후(아마도)

beforeDestroy; destroy: after destroy;

(5) vm.$mount (마운트된 ID 또는 클래스 이름)

새로운 Vue 인스턴스를 추가할 때 el을 추가하지 않으면 마운트되지 않고 생성만 된다는 의미입니다. 이 메소드를 전달하여 특정 위치에 수동으로 마운트할 수 있습니다.

(6) v-for는 배열과 객체를 탐색하고 여러 레이블을 만드는 데 사용됩니다. create Table;

(7) 이스케이프: {{}} 두 개의 중괄호는 값의 html 태그를 이스케이프하지 않습니다.

{{{}}} 세 개의 중괄호는 값의 html 태그를 이스케이프합니다.

값에 바인딩된 데이터를 넣을 수 없습니다(부분을 사용하지 않는 한, 아직 방법은 모르겠습니다).

(8) 보간의 중괄호 안에 표현식을 넣을 수 있습니다. put 함수);

(9) 보간의 중괄호 안에 파이프 기호를 추가하면 필터를 사용할 수 있습니다.

                  capitalize는 첫 글자를 대문자로 표시하는 필터입니다.                                                                                              표현의 일부가 됩니다. ㅋㅋㅋ                                 . 특정 값이 true인 경우 존재합니다.

            v-bind: 속성 이름 = "변수 이름"                                  ‐ out' s''''''''‐''''' 아웃‐‐‐‐‐‐을 통해 ‐ 투게더까지.类 V-ON: 이벤트 유형 = "함수 이름" 이벤트 유형을 트리거할 때

의 약어 v-on is@; 11) 여기에서 속성의 계산 속성을 데이터 속성의 사용으로 사용할 수 있습니다. 장점은 DATA 값이 변경되면 여기에서 변경된다는 것입니다.

(12) 계산된 속성의 설정자 및 게터

기본값은 getter(객체의 속성 가져오기)입니다. 즉, 특정 값이 변경되면 콜백 함수(또는 get 메서드)가 트리거됩니다.

계산된 속성이 변경되면 특정 값을 변경해야 합니다( 예를 들어 10개의 값을 변경하는 경우, 다른 경우에는 이 값을 로컬에서 모니터링하는 것이 좋지 않습니다. 그런 다음 setter(객체의 속성 설정)를 설정해야 합니다. 즉, 계산된 속성이 변경되면 set 메서드가 트리거됩니다. ;

(13) 모니터 속성 vm.$watch (모니터링되는 속성, 콜백 함수)

데이터 속성을 모니터링합니다.

콜백 함수의 첫 번째 매개변수는 변경 후의 값입니다.

속성 값이 변경되면 트리거됩니다.

(14) 클래스 바인딩:

                  v-bind:class를 사용하세요.                                              out out  out out out out out out out out 뒤처지고 싶어  ‐‐‐‐‐w‐bind의 보기는 회오리바람이 될 것이며 이 객체를 데이터 속성에 배치하고 이 객체 객체의 속성을 이런 방식으로 설정하면 됩니다.

    클래스 배열 작성 방법: 배열의 멤버는 변수 이름입니다. .변수가 객체 객체가 아닌 경우 변수의 값은 클래스 이름이고 객체인 경우 객체의 키는 클래스 이름이며 값은 표시 여부를 나타냅니다. 바인딩:

                    v-bind:style

을 사용하세요. 값은 스타일의 값입니다.

v-bind:style 방정식의 오른쪽에 개체 이름을 직접 입력할 수 있습니다.

개체의 값은 실시간으로 변경됩니다.

일부 스타일의 경우 브라우저에 접두사를 추가할 수 있습니다(그러나 일부는 모든 브라우저와 호환되지 않음).

관련 권장 사항: "

vue.js tutorial

"

위 내용은 vuejs는 API인가요?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.