文章目录
- 一、思路
- 二、开干
- 2.1 在app.js中获取当前页面对象，进行函数绑定
- 2.2 页面初始化
- 2.3 调用
- 后记
题记：微信小程序做久了，一直用的都是微信原生的控件，其他的还能凑合用，但是每次关于消息的提醒，都要写那几行冗余代码，不忍吐槽，后来思考要不要封装成组件来用，权衡之后，官方组件只是丑点，但是基本满足需求，所以我们只对基本的showToast和showModal进行封装，毕竟比较高频。
一、思路
封装的话思考点是两点：
封装简单，减少冗余代码
- 优化代码，减少代码的冗余
- 优化调用，使用的时候最好一行代码即可
所以，根据小程序结构封装代码放在全局的app.js最好，使用的时候只需要一次初始化即可。
二、开干
这是我的处理方法，仅供参考，如有更方便的可以交流
2.1 在app.js中获取当前页面对象，进行函数绑定
initNotice(){ let pages = getCurrentPages(); // 获取页面栈 let page = pages[pages.length-1];// 获取当前页面对象 page.showCustomToast = function(e){ // 绑定事件到当前对象 wx.showToast({ title: e, duration:1000, icon:'none' }) } page.showCustomModal = function(title,callback){// 绑定事件到当前对象,至于左右按钮的样式和取消按钮的事件，根据自己的业务自己添加 wx.showModal({ title: '', content: title, success(res) { if (res.confirm) { callback(); } } }) } },2.2 页面初始化
在任意使用消息提醒的页面进行初始化，基本每个页面都会用的到，所以我基本每个页面都进行了调用，上代码：
onLoad: function () { // 页面初始化 options为页面跳转所带来的参数 let app = getApp();//获取全局app对象 app.initNotice(); // 调用这个函数进行事件的初始化绑定 },截止到目前为止，已经绑定完成，就是一行代码
2.3 调用
因为事件已经绑定到当前页面的this对象上了，所以可以直接"this."的形式进行调用，很简单：样例：
let that = this;that.showCustomModal('测试一下Modal',function(){ that.showCustomToast("测试成功！");});效果：
点击确定：
因为个人喜欢不带icon的提示，所以如果有需求可自行封装。
后记
到这里基本完了，比较简单，最后说一下，考虑到app.js不能太笨重，所以只把开发中一些很高频的代码封装进来，嗯，还是挺爽的
