작은 프로그램에서 페이지 간 메시지 및 데이터 전송 문제를 해결하기 위해 JS 라이브러리를 사용하는 방법에 대해 이야기해 보겠습니다.

WeChat 애플릿의 wx.navigateBack 메소드는 값 반환을 지원하지 않기 때문에 페이지는 반환 후 즉시 데이터를 편리하게 업데이트할 수 없습니다.

1. 요구 사항 분석

이러한 유형의 요구 사항은 아마도 페이지 A가 페이지 B에 들어가고 페이지 B가 반환되어 A에 값을 전달하거나 페이지 B에서 이벤트가 트리거될 때 페이지 A에도 이벤트 트리거 변경이 있음을 의미합니다. .

비즈니스 분석

유형 1: WeChat의 wx.setStorage를 사용하여 미니 프로그램 인스턴스에 데이터를 캐시합니다. 페이지 B에서 페이지 A로 돌아갈 때 페이지 B는 먼저 데이터를 캐시한 다음 페이지 A의 onshow 메소드에서 wx.getStorage를 호출하여 캐시를 읽습니다. 그러나 이는 향후 유지 관리에 많은 숨겨진 위험을 가져옵니다. (전역변수 방식과 유사)

두 번째: 이전 페이지 인스턴스를 구하는 방식으로도 이 기능을 구현할 수 있습니다. 코드의 일부는 다음과 같습니다.

이 방법의 단점: B 페이지로의 진입이 많을 수 있기 때문입니다. 그렇게 하면 잘못된 페이지 인스턴스를 얻을 수 있습니다.

2. 메소드 소개

본론으로 가서 onfire.js()를 소개하겠습니다.

onfire.js는 매우 간단한 이벤트 배포 JavaScript 라이브러리(단 0.9kb)이며 간단하고 실용적입니다. 적용 가능:

1.간단한 이벤트 배포.

2. React, Vue.js 및 Angular에서 크로스 구성 요소의 경량 구현에 사용됩니다.

3. 이벤트 구독 및 게시.

사용 아이디어: (모바일 개발을 해본 사람이라면 누구나 iOS 알림 및 Android 방송과 유사하다는 것을 알 것입니다.)

a 페이지 A가 먼저 이벤트를 구독하고 처리 방법을 정의합니다.

b. , 메시지를 보내세요.

c.A 페이지가 제거되면 구독을 취소하세요.

내 사용 방법은 다음과 같습니다.

A 페이지 코드:

A 페이지에서 onfire.on 메서드를 직접 호출하여 key라는 메시지를 구독할 수 있습니다. 위 코드에서는 메시지에 첨부된 매개변수가 매개변수 없이 전달됩니다.
매개변수를 전달해야 하는 경우 함수에 매개변수를 직접 추가하면 됩니다. 예:

onUnload(페이지가 닫힐 때)에서 메시지 구독을 취소하고 eventObj 바인딩을 해제해야 한다는 점에 유의해야 합니다.

B 페이지 코드에서 콜백 영역에 다음 코드를 추가합니다.

3. 라이브러리 코드를 분석합니다

on 메소드를 구독할 때 _bind 메소드를 구독하는 코드에서 알 수 있습니다. 실제로 호출됩니다. 이 방법은 2차원 배열을 사용하여 구독된 개체를 저장합니다.

fire의 메시지 전송 방식의 핵심은 _fire_func 메소드를 호출하고 구독자를 이름(키)으로 순회한 후 구독자에게 알리는 것입니다. un 메소드를 호출하여 구독자를 이름(키)별로 순회하고 찾은 후 제거합니다.

추천: "Mini 프로그램 개발 튜토리얼"

위 내용은 작은 프로그램에서 페이지 간 메시지 및 데이터 전송 문제를 해결하기 위해 JS 라이브러리를 사용하는 방법에 대해 이야기해 보겠습니다.의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!