javascript - vue는 양방향 바인딩을 구현하기 위해 변경 이벤트를 어떻게 수신합니까?

Question

기본 이벤트를 사용하여 입력 상자를 수신하고 변경 시 이러한 이벤트를 바인딩합니다. 이 콜백 함수의 실행 조건은 입력 상자가 흐려진 후입니다

으아아아

그러나 Vue.js 및 React.js와 같은 프레임워크에서는 변경 이벤트에 바인딩된 입력에 대한 콜백 함수를 트리거하기 위해 흐림이 필요하지 않습니다. 대신 IE의 onpropertychange 이벤트처럼 각 실시간 입력이 콜백을 트리거합니다.

이 작업은 어떻게 이루어지나요?

Answer 1

그러나 Vue.js 및 React.js와 같은 프레임워크에서는 변경 이벤트에 바인딩된 입력에 대한 콜백 함수를 트리거하기 위해 흐림이 필요하지 않습니다. 대신 IE의 onpropertychange 이벤트처럼 각 실시간 입력이 콜백을 트리거합니다. 이것은 어떻게 이루어 집니까?

vue의 입력 상자는 기본적으로 입력 이벤트를 수신하므로 입력이 콜백을 트리거합니다. 다음과 같은 방법으로 변경을 트리거하도록 변경할 수 있습니다.

으아악

Answer 2

사실 프레임워크 수준의 맨 아래에는 여전히 DOM 이벤트 모니터링이 있습니다. 예를 들어 언급한 입력 입력 상자는 입력 이벤트를 모니터링하지만 Vue 프레임워크는 입력 이벤트에 작업을 작성할 필요가 없습니다. 작성) DOM 변경 사항을 데이터 모델 변경 사항으로 자동 변환합니다.

최근 gitchat에 공유를 올렸는데, 여기에서 확인하실 수 있습니다. 고급 JavaScript: 양방향 데이터 바인딩에 대한 심층적인 이해

Answer 3

귀하의 질문에 따르면 Vue의 양방향 바인딩 구현 원리를 알고 싶다고 합니다. SF에는 아직 그러한 기사가 많이 있습니다.
@Dengmuqin이 실제로 도난당했습니다. 이 글은 아래 링크 설명을 참고해주세요