// login.js// 获取应用实例var app = getApp()var api = require("../../utils/api.js")Page({data: {motto: '@zhenbei V1.0.0',userInfo: {},hasUserInfo: false,disabled: true,btnstate: 'default',username: '',password: '',canIUse: wx.canIUse('button.open-type.getUserInfo'),canIUseGetUserProfile: false,canIUseOpenData: wx.canIUse('open-data.type.userAvatarUrl') && wx.canIUse('open-data.type.userNickName') // 如需尝试获取用户信息可改为false},// 事件处理函数accountInput: function (e) {var username = e.detail.valueif (username !== '') {this.setData({disabled: false, btnstate: 'primary', username: e.detail.value});} else {this.setData({disabled: true,btnstate: 'default'});}},pwdBlur: function(e) {var password = e.detail.valueif (password != '') {this.setData({password: e.detail.value});}},onClickSubmit:function(e){wx.request({url: api.LoginAPI,data: { username: this.data.username, password: this.data.password, // nickname: e.detail.userInfo.nickName,// avatar: e.detail.userInfo.avatarUrl},method: 'POST',dataType: 'json',success: function (res) {console.log(res)if (res.data.code) {// 初始化用户信息app.initUserInfo(res.data.data, e.detail.userInfo);// 跳转会上一级页面wx.redirectTo({url: '../index/index',});} else {wx.showToast({ title: "登录失败", icon: 'none' });}}})},bindViewTap() {},onLoad() {},})
// login.json{"usingComponents": {}}```
帐号 密码
</view><view class="hr"></view><!-- <button class="btn" disabled="{{disabled}}" type="{{btnstate}}" bind:tap="login">登录</button> --><button class="btn" disabled="{{disabled}}" type="{{btnstate}}" open-type="getUserInfo" bindgetuserinfo="onClickSubmit">登录</button><view class="operate"><view><navigator url="../mobile/mobile">手机快速注册</navigator></view><view>找回密码</view></view><!-- <view class="login"><view><image src="..//images/wxlogin.png" /></view><view><image src="../images/qqlogin.png" /></view></view> -->
/* pages/login/login.wxss */
/index.wxss/
.content {
margin-top: 60px;
}
.userinfo {
display: flex;
flex-direction: column;
align-items: center;
color: #aaa;
}
.userinfo-avatar {
overflow: hidden;
width: 200rpx;
height: 200rpx;
margin: 0rpx;
border-radius: 50%;
}
.account {
display: flex;
flex-direction: row;
padding-left: 0px;
padding-top: 10px;
padding-bottom: 10px;
width: 100%;
}
.title {
margin-right: 30px;
font-weight: bold;
}
.hr {
border: 1px solid #ccc;
opacity: 0.2;
width: 90%;
margin: 0 auto;
}
.see {
position: absolute;
right: 20px;
}
.btn {
width: 90%;
margin-top: 40px;
color: #999;
}
.operate {
display: flex;
flex-direction: row;
}
.operate view {
margin: 0 auto;
margin-top: 40px;
font-size: 14px;
color: #333;
}
.login {
display: flex;
flex-direction: row;
margin-top: 60px;
}
.login view {
margin: 0 auto;
}
.login image {
width: 70px;
height: 98px;
}
.usermotto {
margin-top: 140px;
font-size: 15px;
}