微信小程序实现登陆页面代码

wxml

<view>

账号：<input data-id="u_name" bindinput="setVals" />

</view>

<view>

密码：<input data-id=u_password" bindinput="setVals" type="password"/>

</view>

<view>

</view>

wxss

.userinfo {

display: flex;

flex-direction: column;

align-items: center;

color: #aaa;

}

.userinfo-avatar {

overflow: hidden;

width: 128rpx;

height: 128rpx;

margin: 20rpx;

border-radius: 50%;

}

.usermotto {

margin-top: 50px;

}

.usermotto >view{

display:flex;

margin-top: 12px;

}

.usermotto> view> input{

border-bottom: 1px rgb(15, 15, 15) solid;

border-color: rgb(15, 15, 15);

}

.btn_login{

margin-top: 30px;

background-color: rgb(75, 111, 209);

}

data: {

u_name: '',

u_password: ''

btn(e){

let name = this.data.u_name;

let password = this.data.u_password;

// if(name == null || name == "" || name == undefined || name == "undefined"){

if(this.isNull(name)){

wx.showToast({

title: '请输入账号！',

icon: 'error'

});

}else if(this.isNull(password)){

wx.showToast({

title: '请输入密码！',

icon: 'error'

});

}else{

wx.request({

url: 'http://114.116.32.26:8080/func/OPERATOR/LOGIN',

method: 'GET',

data: {

loginname: name,

pass: password

success: function (res) {

if(res.data.errorcode == 0){

app.globalData.userInfo = res.data.employee;

console.log(app.globalData.userInfo);

wx.navigateTo({

url:"../home/home"

})

}else{

wx.showToast({

title: res.data.message,

icon: 'error'

});

}

})

}

isNull(val){

console.log(val);

if(val == null || val == "" || val == undefined || val == "undefined" ){

return true

}else{

return false

}

}, setVals(e){

this.setData({

[e.currentTarget.dataset.id]:e.detail.value

})

console.log(this.data);

微信小程序实现登陆页面代码相关推荐

微信小程序登录注册页面代码
以下是一个简单的微信小程序注册登录页面的代码示例:  <view class="container"><form ...
微信小程序突然多了好多动态_让微信小程序的登陆页面有云朵悬浮的动态效果...
微信小程序目前的火热程度相信不用多言,尤其是近期微信团队开发小程序很多之前被诟病的功能:模糊搜索,附近小程序等.最近有网友利用空余时间用小程序实现了个动态的登录页效果,所以下面我们51小程序就吧这篇文 ...
微信小程序内含H5页面实现方式
微信小程序内含H5页面实现方式一.背景众所周知,我们写完小程序,发到线上,是需要经历设置版本.提交代码审核.等待审核等步骤,放一个版本下来可能花费很多的时间,甚至很可能等待了很长时间,审核未通过, ...
微信小程序|上下滚动页面实现
欢迎点击「算法与编程之美」↑关注我们! 本文首发于微信公众号:"算法与编程之美",欢迎关注,及时了解更多此系列文章. 欢迎加入团队圈子!与作者面对面!直接点击! 案例描述微信小程 ...
微信小程序开发--分类页面实现
微信小程序开发–分类页面实现之前在详情页面利用Vant Weapp的UI库构建出了GoodsAction 商品导航功能,接着需要在分类页面(kind.wxml)实现商品分类. 1.引入第三方组件用 ...
微信小程序的抽奖页面
微信小程序的抽奖页面做一个1-10的微信小程序抽奖界面,随机到6和8会显示中奖信息! 点开始按钮开始执行,点结束按钮结束抽奖并且判断是否中奖 wxml代码: <view>{{title} ...
php自定义弹窗,微信小程序弹窗自定义的代码
这篇文章主要介绍了微信小程序弹窗自定义实例代码的相关资料,有时候做开发项目的时候需要根据客户需求更改原系统的组件,这里就对小程序中弹窗进行更改,需要的朋友可以参考下微信小程序弹窗首先wxml代 ...
微信小程序——意见反馈页面的实现（使用使用微信官方反馈功能）
微信小程序--意见反馈页面的实现 (使用使用微信官方反馈功能) 代码: .json {"navigationBarTitleText": "问题反馈" } .w ...
微信小程序动态生成页面2020-04-13
微信小程序动态生成页面我最近自己在做小程序参加竞赛,然后记录下自己的心得,希望对在座的各位有点帮助吧.然后我的Q:2991194667,有问题可以一起探讨. 1.首先是我打算做一个瀑布流的布局,像淘 ...

微信小程序实现登陆页面代码

微信小程序实现登陆页面代码相关推荐

最新文章

热门文章