vue와 미니 프로그램의 차이점은 무엇인가요?

vue와 미니 프로그램의 차이점: 1. Vue는 일반적으로 생성되거나 마운트된 데이터를 요청하는 반면, 미니 프로그램에서는 onLoad 또는 onShow에서 데이터를 요청합니다. 2. Vue는 변수 값을 특정 값에 동적으로 바인딩합니다. 요소 속성을 지정할 때 변수 앞에 콜론이 추가되고, 애플릿이 변수 값을 요소 속성에 바인딩할 때 두 개의 중괄호로 묶입니다. 3. Vue는 "v-if"를 사용합니다. 및 "v-show" "요소의 표시 및 숨기기를 제어하기 위해 미니 프로그램은 "wx-if" 및 숨겨진 제어를 사용합니다.

이 문서의 운영 환경: Windows 10 시스템, Vue3 버전, Dell G3 컴퓨터.

vue와 미니 프로그램의 차이점은 무엇인가요?

1. 라이프 사이클 기능이 다릅니다:

- WeChat 미니 프로그램은 onLoad: 페이지 로딩, onShow: 페이지 표시, onReady: 초기 렌더링입니다. 페이지가 완료되었습니다. onHide: 페이지 숨김, onUnload: 페이지가 언로드되었습니다.

- Vue의 후크 기능은 새 페이지로 이동할 때 실행되지만 미니 프로그램의 후크 기능은 페이지의 다양한 점프 방법에서 다양한 후크를 실행합니다. beforecreate,created는 네트워크 요청에 적합하며 beforemout은 데이터 업데이트, 이동, beforeupdate, 업데이트, beforedestory, 파괴됩니다.

2. 데이터 요청 시간이 다릅니다:

페이지가 로드되어 데이터를 요청할 때 두 후크의 사용은 일반적으로 미니 프로그램에서 생성되거나 마운트된 데이터를 요청합니다. onLoad에서 데이터를 요청하거나 onShow에서 데이터를 요청합니다.

3. 데이터 바인딩 방법은 다릅니다.

vue가 변수 값을 요소의 속성에 동적으로 바인딩하면 변수 앞에 콜론이 추가됩니다. 미니 프로그램: 변수 값이 요소 속성에 바인딩되면 두 개의 중괄호로 묶입니다. 괄호가 포함되지 않으면 문자열로 간주됩니다.

4 요소 표시 및 숨기기가 다릅니다.

vue에서는 v-if 및 v-show를 사용하여 요소 표시 및 숨기기를 제어합니다. 애플릿에서는 wx-if 및 hided를 사용하여 요소의 표시 및 숨기기를 제어합니다.

5. 이벤트 처리가 다릅니다.

vue: v-on:event를 사용하여 이벤트를 바인딩하거나 @event를 사용하여 미니 프로그램에서 이벤트를 바인딩하거나, findtap=""을 사용합니다. 이벤트를 바인딩하고 catchtap을 사용하면 이벤트가 버블링되는 것을 방지할 수 있습니다.

6. 양방향 데이터 바인딩이 다릅니다:

vue에서는 양식 요소에 v-model을 추가한 다음 양식의 내용이 데이터에 해당 값을 바인딩하기만 하면 됩니다. 요소가 변경되면 데이터의 해당 값도 그에 따라 변경됩니다. 미니 프로그램에서는 폼의 내용이 변경되면 폼 요소에 바인딩된 메소드가 실행되고, 이 메소드에서는 this.setData({key:value}를 통해 폼의 값이 데이터의 값에 할당됩니다. ) 해당 값.

7. 바인딩 이벤트 매개변수는 다릅니다.

vue에서 바인딩 이벤트 매개변수는 이벤트를 트리거하는 메서드에서 형식 매개변수로만 전달하면 됩니다. 애플릿에서는 이벤트 바인딩 메서드에서 매개변수를 직접 전달할 수 없습니다. 매개변수를 속성 값으로 사용하고 이를 요소의 데이터 속성에 바인딩한 다음 e.currentTarget.dataset.*를 사용해야 합니다. 메소드를 가져오면 매개변수 전송이 완료됩니다.

8. 상위 구성요소와 하위 구성요소 간의 통신이 다릅니다.

하위 구성요소 생성이 다릅니다.

• vue에 필요함:

1 하위 구성요소 작성; . 필요할 때 사용

3. vue 구성요소에 등록

4.

미니 프로그램에는 다음이 필요합니다.
1. 하위 구성 요소를 작성합니다.

2. 하위 구성 요소의 json 파일에서 해당 파일을 구성 요소로 선언합니다. 도입해야 하는 상위 구성요소의 json 파일에서 usingComponents에 가져온 구성요소의 경로와 구성요소를 입력합니다.

상위 구성요소에서 직접 가져옵니다. 다른 값 전달:

In vue,

상위 구성 요소에서 하위 구성 요소로 데이터를 전달하려면 하위 구성 요소에서 v-bind를 통해 값을 전달하기만 하면 됩니다. props를 통해 이를 수신하여 데이터 전송을 완료합니다. 하위 구성 요소와 상위 구성 요소 간의 통신은 this.emit 메서드와 데이터를 상위 구성 요소에 전달할 수 있습니다.
미니 프로그램에서는

부모 컴포넌트가 직접 변수에 값을 할당하고, 자식 컴포넌트 속성에서는 전달된 값을 받습니다.

• 상위 구성 요소가 하위 구성 요소의 메서드를 호출하려는 경우

vue는 하위 구성 요소에 ref 속성을 추가합니다. this.refs.ref 값을 통해 하위 구성 요소의 모든 메서드를 얻을 수 있습니다. 라고 불리는. .

애플릿은 하위 구성요소에 ID나 클래스를 추가한 후 this.selectComponent를 통해 하위 구성요소를 찾은 다음 하위 구성요소의 메소드를 호출하는 것입니다.

추천 학습: "nodejs 비디오 튜토리얼"

위 내용은 vue와 미니 프로그램의 차이점은 무엇인가요?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!