위 챗 애플 릿 사용자 정의 구성 요소 전송 페이지 와 구성 요소 상호 전송 데이터 작업 예제

1864 단어
이 사례 는 위 챗 애플 릿 사용자 정의 구성 요소 전송 페이지 와 구성 요소 가 서로 데 이 터 를 전달 하 는 작업 을 보 여 줍 니 다.여러분 께 참고 하도록 공유 하 겠 습 니 다. 구체 적 으로 는 다음 과 같 습 니 다.
구성 요소 에서 페이지 로 이동 하 는 방법 을 원 하고 구성 요소 에서 데 이 터 를 페이지 로 전송 하려 면 emmmm 에서 보라색 으로 바 꿀 수 있 습 니 다.
구성 요소 이벤트 triggerEvent 로!
우선, 페이지 에서 구성 요 소 를 정의 합 니 다. json 파일 에 다음 을 추가 하 십시오.

{
 "usingComponents": {
 "user-btn": "/pages/component/userInfo/userInfo"
 }
},


그리고 index. wxml ~
index.wxml

...

...


구성 되 었 습 니 다:

//                   
this.triggerEvent('showTab', res.data);

res.data 구성 요소 에서 요청 한 데이터 입 니 다.
index. js 로 돌아 가 그의 쇼 Tab 방법 ~

 showTab:function(e){
  console.log('this is showtabBar');
  console.log(e.detail);
 },


그러면 이 e.detail 는 구성 요소 의 res.data 데 이 터 를 얻 을 수 있 습 니 다 ~
당연히 페이지 에서 구성 요소 로 데 이 터 를 가 져 가 려 면:
예 를 들 어 방금 index. wxml 의 show 와 같이 페이지 의 index. js 는 userShow 의 값 을 마음대로 제어 할 수 있 습 니 다.
index.wxml

...

...


그리고 구성 중 에 우리 가 페이지 에서 들 어 오 는 값 을 이렇게 찾 을 수 있 습 니 다.

 properties: { //    ,      wxml       ,       properties   
 'show':{
  type:Boolean,
  value:'',
  observer: function (newVal, oldVal) {
  console.log(newVal)
  }
 },
 },
 ready:function(){
 console.log(this.properties);
 },


됐다.  큰 성 과 를 거두다.
본 논문 에서 말 한 것 이 여러분 의 위 챗 애플 릿 개발 에 도움 이 되 기 를 바 랍 니 다.

좋은 웹페이지 즐겨찾기