uni-app 之 短信验证码登录
image.png
image.png
<template><view style="width: 100%; display: flex; flex-direction:column; align-items:center;"><view style="width: 300px; margin-top: 100px;"><!-- // --><!-- 1，输入手机号码，获取验证码 --><view style="display: flex; "><u-input placeholder="请输入手机号码" v-model="logon_phone" /><button @click="getphoneurl">验证码</button></view><!-- // --><!-- 2，输入验证码，登录 --><u-input placeholder="请输入验证码" v-model="logon_code" /><button @click="getcodeurl">登录</button></view><!-- 返回参数 --><text>retCode={{urlretCode}}; </text><text>retMsg={{curlretMsg}}; </text><text>retdata={{curlretdata}}; </text></view>
</template><script>export default {data() {return {// 返回參數urlretCode: "",curlretMsg: "",curlretdata: "",// 輸入框内容logon_phone: "",logon_code: "",};},methods: {// 按钮点击后执行的方法///// 1，输入手机号码，获取验证码getphoneurl() {// uni.showLoading({// title: "加载中" // 加个进度条// })console.log("111 111 logon_phone 打印", this.logon_phone)uni.request({url: "https://api.xxx.com/sms/SendSms/" + this.logon_phone,success: res => {console.log("111 111 res 打印", res) // log打印获取的数据this.urlretCode = res.data.retCodethis.curlretMsg = res.data.retMsg// uni.hideLoading() // 加载出来后，关闭进度条}})},///// 2，输入验证码，登录getcodeurl() {// uni.showLoading({// title: "加载中" // 加个进度条// })let params = {// "phone": "177128xxxxx",// "verificationCode": "5546","phone": this.logon_phone,"verificationCode": this.logon_code,}console.log("222 222 params 打印", params) // log打印获取的数据uni.request({method: 'post',url: "https://api.xxx.com/cusInfo/login",data: params,success: res => {console.log("222 222 res 打印", res) // log打印获取的数据this.urlretCode = res.data.retCodethis.curlretMsg = res.data.retMsgthis.curlretdata = res.data.data// 存储返回的tokenuni.setStorageSync('s_token', res.data.data);uni.setStorageSync('s_retCode', res.data.retCode);// 打印存储的tokenconst token = uni.getStorageSync('s_token'); //获取tokenconst g_phone = uni.getStorageSync('s_phone'); //获取tokenconsole.log("333 333 token>>>", token, g_phone) // log打印获取的数据if (token) {//存在则关闭前页面uni.navigateBack({//关闭当前页面，返回上一页面或多级页面。delta: 1});} else {//不存在则跳转至登录页// uni.reLaunch({// url: "/pages/ldy_logon/ldy_logon",// success: () => {// plus.navigator.closeSplashscreen();// }// })}}})},},onLoad() {// 页面刚进去就初始化的方法// this.getphoneurl(),// this.getcodeurl()},}
</script><style lang="scss"></style>
