1、创建工具函数文件
创建src/util.js工具函数文件,用来放我们后期会重复用到的函数,比如提示框,HTTPS请求等。粘贴下面代码到util.js文件中
//消息提示框 export function showSuccess (text) { //wx.showToast是小程序现成的API,其中title是提示的内容,icon是显示的图标 wx.showToast({ title: text, icon: 'success' }) }
wx.showToast使用文档
https://developers.weixin.qq.com/miniprogram/dev/api/ui/interaction/wx.showToast.html
2、引用util.js文件
在src/components/LoginWindow.vue文件中添加import引用util.js文件,我们就可以在LoginWindow.vue文件中直接使用showSuccess方法了
//参考代码,无需粘贴 //import qcloud from 'wafer2-client-sdk' //import config from '@/config' //需要添加的部分 import {showSuccess} from '@/util'
3、使用showSuccess方法
编辑script部分的methods对象,在loginSuccess方法中使用,不要忘记保存文件哦~
//参考代码,无需粘贴 //loginSuccess (res) { //需要添加的部分 showSuccess('登录成功') //参考代码,无需粘贴 //wx.setStorageSync('userinfo', res) //},
4、查看效果
在Storage中删除掉缓存信息,点击编译按钮刷新页面,点击授权登录按钮,登录成功后,就会出现登录成功的弹窗