微信小程序自定义弹框组件

由于微信小程序自带的toast及model都有很大的限制，很多产品对弹框的要求是多样化的，于是自己动手封装实现一组弹框功能。该组件只是提供一种实现方式，对样式不满意可自行修改。

实现效果图

model

-loading

开发者工具查看效果

如何使用

1、在需要使用的页面引入wxss

@import '../component/wx-layer/wx-layer.wxss';

2、wxml引入模块

<import src='../component/wx-layer/wx-layer.wxml' /><template is="wxLayer" data="{{...wxLayer}}"/>

3、js引入

import WxLayer from '../component/wx-layer/wx-layer';Page({onLoad() { //onload中初始化组件new WxLayer();}})

使用

1、toast: this.showToast(title, duration, mask);

2、model: this.showModal({title, content, confirmText, cancelText, confirm, showCancel, mask});

3、loading: this.showLoading(mask,text);

查看元整代码

如果我的代码对你有帮助，请给个start吧！ ^^