欢迎光临，了解微信小程序开发，就上易用通！

当前位置 : 易用通 > 小程序模板
微信小程序实用组件－modal和toast通用插件封装微信小程序实用组件－modal和toast通用插件封装
立即下载

微信小程序实用组件－modal和toast通用插件封装

模板分类 ： 小程序模板 模板编号 ： Y202 源码文件 ： 完全开源 下载权限 ： VIP会员
模板大小 ：  模板指数 ：  ℃ 更新时间 ： 2018-01-16 16:16 模板等级 ： ☆☆☆☆☆

模板截图：

通过在app.js中初始化代码后，在任何js中直接调用， 开发的目的在于以后拓展以及自定义样式比较方便，调用也很方便，不需要写大量冗余代码。 微信小程序实用组件－modal和toast通用插件封装(图1) 
  1. app.toast.success('success')
复制代码
微信小程序实用组件－modal和toast通用插件封装(图2) 
  1. app.modal.confirm('This is confirm', function () {
  2.       console.log('confirm')
  3.     }, function () {
  4.       console.log('cancel')
  5.     })
复制代码
微信小程序实用组件－modal和toast通用插件封装(图3) 
  1. app.toast.load('loading')
复制代码
loading自带旋转动画 微信小程序实用组件－modal和toast通用插件封装(图4)  如何使用它！ 1、在app.js导入adUI并初始化它
  1. var adUI = require('./adUI/adUI')
  2.  
  3. App({
  4.   onLaunch: function () {
  5.     adUI.init(this)
  6.   },
  7.   onShow: function () {
  8.   },
  9.   onHide: function () {
  10.   }
  11. })
复制代码
2、在app.wxss底部倒入adUI样式
  1. @import './adUI/adUI.wxss'
复制代码
3、在相应页面导入模板
  1. <import src="../../adUI/adUI.wxml" />
  2. <template is="adUI" data="{{ adUI }}" />
复制代码
4、在自己的js里像这样使用adUI
  1. var app = getApp()
  2.  
  3. Page({
  4.   data: {
  5.   },
  6.   onLoad: function () {
  7.   },
  8.   onReady: function () {
  9.   },
  10.   onShow: function () {
  11.     app.modal.alert('This is alert', function () {
  12.       console.log('confirm')
  13.     })
  14.   },
  15.   onHide: function () {
  16.   },
  17.   onUnload: function () {
  18.   }
  19. })
复制代码
 

加入收藏
立即下载
分享到微信朋友圈
X

免责声明：

1. 本站所有素材（未指定商用），仅限学习交流，请勿用于商业用途。
2. 本站所有小程序模板Demo和图片均来自用户分享上传和网络收集，模板和图片版权归原作者及原出处所有。
3. 未经合法授权，会员不得以任何形式发布、传播、复制、转售该素材。

他的发布 已发布2511

推荐标签

下载该资源用户也下载了

- 随便看看 -
开发文档 | 运营教程 小程序模板 | 小程序应用 | 标签大全
Copyright © 2017 https://www.yiyongtong.com 易用通 版权所有