노드에서.js 이벤트 트리거에서 Vue 사용자 정의 이벤트에 대한 깊이 있는 설명

Node.js의 이벤트 트리거가 일으키는 사고
오늘 노드를 보고 있어요.js 문서에서 이벤트 트리거에 대해 이야기했는데 그 중에서emit 방법은 Vue의 사용자 정의 이벤트를 생각하게 했습니다. 이로써 저는 Vue에 대해 새로운 이해를 가지게 되었습니다. 그래서 제 이해를 기록하고 학습 노트로 남깁니다.
Node.js의 이벤트 트리거
Node.js는 이벤트 모듈을 제공합니다: EventEmitter, 이벤트를 처리할 수 있습니다.

const EventEmitter = require('events')
const eventEmitter = new EventEmitter()

eventEmitter 객체에는 on과 emit 두 가지 방법이 있습니다.

on은 사용자 정의 이벤트를 추가하고 리셋 함수를 등록하는 데 사용됩니다

emit는 이벤트를 촉발하고 매개 변수를 리셋 함수에 전달합니다.

eventEmitter.on('start', (e) => {
 console.log(e)
})
eventEmitter.emit('start', 'started')

컨트롤러가 started를 인쇄합니다
Vue의 사용자 지정 이벤트
구성 요소에 사용자 정의 이벤트를 추가합니다. 다음 예시 코드에 있는enlarge-text 이벤트는 우리가 정의한 이벤트입니다. onEnlargeText는 이벤트가 촉발될 때 실행해야 하는 리셋 함수입니다. 여기 있는 onEnlargeText는 함수 바늘로 methods에 정의된 onEnlargeText 함수를 가리킵니다.리셋 함수이기 때문에 매개 변수가 전달될 수 있습니다. 사용자 정의 이벤트의 리셋 함수 중의 매개 변수는 누가 전달하고 구체적인 의미는 무엇입니까?

<blog-post
 ...
 @enlarge-text="onEnlargeText">
</blog-post>

methods: {
 onEnlargeText: function (enlargeAmount) {
  this.postFontSize += enlargeAmount
 }
}

하위 구성 요소 이벤트 처리에서 내장된'$emit'방법을 통해 부모 구성 요소 사용자 정의 이벤트 이름으로 이 사용자 정의 이벤트를 터치할 수 있으며,'$emit'의 두 번째 파라미터를 통해 부모 구성 요소에 전달해야 하는 데이터를 던질 수 있습니다. 그러면 사용자 정의 이벤트의 리셋 함수 중의 파라미터 출처도 알 수 있습니다. 바로'$emit'방법의 두 번째 파라미터입니다. 여기서 더욱 유연한 대상을 던질 수 있습니다.

<button @click="$emit('enlarge-text', 0.1)">
 Enlarge text
</button>

여기서 Vue의 사용자 정의 이벤트와 Node를 볼 수 있습니다.js의 이벤트 트리거의 이념은 매우 비슷하다. Vue에서 사용자 정의 이벤트의 등록은 부모 구성 요소에서 이루어지고 트리거는 하위 구성 요소에서 이루어진다.이로써 Vue 사용자 정의 이벤트에 대한 설명이 완료되었습니다.
참고 자료
nodejs.cn/learn/the-n…
cn.vuejs.org/v2/guide/co…
총결산
이 책은 Node로부터js 이벤트 트리거에서 Vue 사용자 정의 이벤트에 대한 기사는 여기 있습니다.js 이벤트 트리거에서 Vue 사용자 정의 이벤트 내용까지 저희 이전 글을 검색하거나 아래 관련 글을 계속 찾아보세요. 앞으로 많이 사랑해 주세요!