> 위챗 애플릿 > 미니 프로그램 개발 > WeChat 애플릿은 모달 구성 요소를 사용하여 대화 상자 예제 공유를 팝업합니다.

WeChat 애플릿은 모달 구성 요소를 사용하여 대화 상자 예제 공유를 팝업합니다.

小云云
풀어 주다: 2018-01-05 13:40:11
원래의
6448명이 탐색했습니다.

이 글에서는 모달 컴포넌트를 활용한 위챗 애플릿의 팝업 대화 상자 기능을 주로 소개하며, 위챗 애플릿 모델 컴포넌트의 관련 속성과 이벤트 응답 동작 기술을 예시 형태로 분석합니다. 그것이 모두에게 도움이 되기를 바랍니다.

1. 효과 표시

2. 키 코드

1, index.wxml

<view>提示:{{tip}}</view>
<button type="default" bindtap="showModal">点击我弹出modal对话框</button>
<view>
 <modal title="modal对话框" hidden="{{modalHidden}}" confirm-text="确定" cancel-text="取消" bindconfirm="modalBindaconfirm" bindcancel="modalBindcancel">您好,我是modal对话框</modal>
</view>
로그인 후 복사

2, index.js

Page({
 data:{
  // text:"这是一个页面"
  tip:&#39;&#39;,
  buttonDisabled:false,
  modalHidden:true,
  show:false
 },
 showModal:function(){
  this.setData({
   modalHidden:!this.data.modalHidden
  })
 },
 modalBindaconfirm:function(){
   this.setData({
   modalHidden:!this.data.modalHidden,
   show:!this.data.show,
   tip:&#39;您点击了【确认】按钮!&#39;,
   buttonDisabled:!this.data.buttonDisabled
  })
 },
 modalBindcancel:function(){
   this.setData({
   modalHidden:!this.data.modalHidden,
   tip:&#39;您点击了【取消】按钮!&#39;
  })
 }
})
로그인 후 복사

WeChat 미니 프로그램 모달 구성 요소에 대한 자세한 소개

Bootstrap의 모달 구성 요소를 사용하여 경고, 확인 및 모달 대화 상자를 사용자 정의하는 방법_javascript 기술

WeChat 애플릿 모달 팝업 구성 요소에 대한 자세한 설명

위 내용은 WeChat 애플릿은 모달 구성 요소를 사용하여 대화 상자 예제 공유를 팝업합니다.의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿