快应用开发注册功能手机注册与登录
<import name='header' src='../Common/header'></import>
<import name='footer' src='../Common/footer'></import>
<template>
<div class="demo-page">
<div class="page-title-wrap">
<text class="page-title">现在注册</text>
</div>
<div class="input-item">
<input class="input-text" type="tel" autocomplete="on" placeholder="请输入手机号" onchange="showChangeMobile"></input>
<input class="input-button color-3" type="button" value="提交" onclick="login()"></input>
</div>
<div class="page-title-content">
<text class="page-title-two">说明:内容。。。</text>
<text class="page-title-two">说明:内容。。。</text>
<text class="page-title-two">说明:内容。。。</text>
</div>
<!-- footer -->
<div>
</div>
</div>
</template>
<script>
import prompt from '@system.prompt'
import device from '@system.device'
import fetch from '@system.fetch'
import router from '@system.router'
export default {
private: {
text: '立即注册',
componentName: 'input',
inputValueMobile: '',
inputType: 'text',
thisdevice:''
},
/**
* 当用户点击菜单按钮时触发,调用app中定义的方法showMenu
* 注意:使用加载器测试`创建桌面快捷方式`功能时,请先在`系统设置`中打开`应用加载器`的`桌面快捷方式`权限
*/
onMenuPress() {
this.$app.$def.showMenu()
},
onInit () {
this.getdevide()
},
getdevide(){
//console.log('init getdevide')
var thisobj = this.$app.$data
device.getDeviceId({
success: function(data) {
//console.log('init getdevide()')
//prompt.showToast({message:data.deviceId})
thisobj.thisdevice = data.deviceId
},
fail: function(data, code) {
prompt.showToast({message:code})
}
})
},
showChangeMobile (e) {
this.$app.$data.inputValueMobile = e.value
},
login()
{
var mobile = this.$app.$data.inputValueMobile
var thisdevice = this.$app.$data.thisdevice
if(!mobile || mobile.length!==11)
{
prompt.showToast({message:'请输入正确的手机号'})
return
}
fetch.fetch({
url: 'http://www.a.com/api_quickapp/index',
data:{mobile:mobile, device:thisdevice},
responseType: 'json',
success: function (response) {
var returnData = response.data//response:{code:2, data:{'success':1,'msg':'','data':{}}}
prompt.showToast({message:returnData.msg})
if(!returnData || (returnData.success!=1))
{
return //end
}
//prompt.showToast({message:JSON.stringify(response)})
router.push ({
uri: '/DemoDetail/loginin'
})
},
fail: function (data, code) {
prompt.showToast(`handling fail, errMsg = ${data}`)
prompt.showToast(`handling fail, errCode = ${code}`)
}
})
}
}
</script>
<style>
.demo-page {
flex-direction: column;
justify-content: center;
padding-left: 100px;
}
.page-title-wrap{
margin-bottom: 100px;
margin-top: 100px;
}
.page-title{
font-size: 40px;
}
.page-title-content{
margin-top: 200px;
}
.title {
font-size: 40px;
text-align: center;
}
.input-text
{
background-color: #fff;
border: 1px solid #c9c9c6;
height: 100px;
width: 60%;
padding-left: 20px;
}
.input-button{
width: 120px;
color:#fff;
background-color: #09ba07;
}
</style>