学习新东西时,大体都遵循一样的道理,由总入深。

以下整理一下学习小程序的过程。虽然现在做的东西还有许多问题,比如说数据超过一定数量时循环效率低,或者是多次跳转页面后会变卡等问题。这些问题只解决了部分,所以肯定会有许多错误。仅仅记录下来,自娱自乐。

官网API糊上:https://mp.weixin.qq.com/debug/wxadoc/dev/api/

1、目录结构

工具卸载了,好久没登所以尬写一下吧:

登录页面:

<view class="container">
<view class="userinfo">
<image class="userinfo-avatar" src="/pages/index/images/logo01.png" ></image>
</view>
<form bindsubmit="formSubmit">
<view class="section">
<image class="section01" src="/pages/index/images/iphone.png" >
</image><input name="phone" bindblur="getPhone" placeholder="请输入您的手机号" auto-focus/>
</view>
<view class="section section02">
<image class="section03" src="/pages/index/images/suo.png" ></image>
<input name="pwd" bindblur="getPwd" type="password" placeholder="请输入您的密码" />
</view>
<button type="" formType="submit" class="anniu" bindtap=""> 登录 </button>
</form>
</view>
//index.js
//导入js
var network = require("../../utils/network.js")
//获取应用实例
var app = getApp()
Page({
data: {
wxInfo: {},
userInfo: {},
custmerInfo: {},
imgsrc:'/pages/index/images/03.jpg',
phone:'',
pwd:'',
tip:'',
result:''
},
//事件处理函数
bindViewTap: function() {
wx.navigateTo({
url: '../logs/logs'
}) },
//获取输入的手机号与密码保存至data,未使用form提交
getPhone:function(e) { this.setData({
phone:e.detail.value
})
},
getPwd:function(e) {
this.setData({
pwd:e.detail.value
})
},
//提交
formSubmit: function(e) {
var URL=getApp().globalData.ZZTURL;
var page =this;
var phone=e.detail.value.phone;
var pwd =e.detail.value.pwd;
console.log(phone + "===" + pwd + "===" + URL);
//非空判断
if(phone==null||phone==''||phone==undefined){ wx.showToast({
title: '手机号不能为空',
icon: 'loading',
duration: 2000
});
return;
}
if(pwd==null||pwd==''||pwd==undefined){
wx.showToast({
title: '密码不能为空',
icon: 'loading',
duration: 2000
});
return;
}
//正则判断
//声明验证正则,超过长度验证失效
var regPhone = new RegExp('13[0-9]{9}|14[0-9]{9}|15[0-9]{9}|17[0-9]{9}|18[0-9]{9}', 'g');
var regMail = new RegExp('^(\\w)+(\\.\\w+)*@(\\w)+((\\.\\w+)+)$', 'g'); var phReg = regPhone.exec(phone);
var mgReg = regMail.exec(phone);
console.log("phReg"+phReg)
console.log("mgReg" + mgReg)
if ((phReg == null || phReg == '' || phReg == ',' || phReg == undefined) && (mgReg == null || mgReg == '' || mgReg == ',' || mgReg == undefined)){
wx.showToast({
title: '请输入正确的手机号',
icon: 'loading',
duration: 2000
});
return;
}else{
//调用接口查询用户名密码是否正确,如果正确,返回用户详细信息(密码set为XXX) wx.request({
method:'GET',
url: URL+'/registService/validateLoginApp/'+this.data.phone+','+this.data.pwd, ///registService/
header: {
'content-type': 'application/json'
},
success: function(res) {
//result状态 0:出错 1:密码正确 2:密码错误 3账户不存在
var result =res.data.result;
var userInf=res.data.userInf;
if(result==1){
//密码正确,判断是否冻结
if(userInf.is_freeze){
wx.setStorageSync('isLogin', false);
//提示已经被冻结,请联系客服
wx.showToast({
title: '账户已被冻结',
icon: 'loading',
duration: 2000
});
return;
}
//赋值userInfo并且跳转
page.setData({//这个可以不赋值,其它需求备用
userInfo: userInf
})
//同步
wx.setStorageSync('isLogin', true);
wx.setStorageSync('userInf', userInf); //页面跳转
wx.redirectTo({
url: '/pages/shouye/shouye'
})
}else if(result==2){
wx.setStorageSync('isLogin', false);
wx.showToast({
title: '密码错误',
icon: 'loading',
duration: 2000
});
return;
}else if(result==3){
wx.setStorageSync('isLogin', false);
wx.showToast({
title: '用户不存在',
icon: 'loading',
duration: 2000
});
return;
}
},
fail:function(){
wx.showToast({
title: '网络异常',
icon: 'loading',
duration: 2000
});
return;
}
}) } }, onLoad: function () {
console.log('onLoad')
var isLogin=wx.getStorageSync('isLogin');
console.log("isLogin"+isLogin)
if(isLogin==true){
//页面跳转
wx.navigateTo({
url: '/pages/shouye/shouye'
})
}
var that = this
//调用应用实例的方法获取全局数据
app.getUserInfo(function(userInfo){
//更新数据
that.setData({
wxInfo:userInfo
})
})
}
})

【微信小程序】记录的更多相关文章

  1. 微信小程序记录

    1.vs code 可以安装 Vetur-wepy 对代码高亮的提示. 2.取消swiper组件的手动滑动效果 在 swiper-item 中添加 catchtouchmove='catchTouch ...

  2. 微信小程序开发技巧及填坑记录

    以下是自己在开发过程中遇到的坑和小技巧,记录以下: 1.出现了 page[pages/XXX/XXX] not found.May be caused by :1. Forgot to add pag ...

  3. 微信小程序bug记录与解决

    微信小程序bug记录 textarea textarea在模拟器上没有padding,可是在真机上会自带padding,而且在外部改不了,并且在安卓和IOS上padding还不一样 第一张图是在开发工 ...

  4. 微信小程序之蓝牙 BLE 踩坑记录

    前言 前段时间接手了一个微信小程序的开发,主要使用了小程序在今年 3 月开放的蓝牙 API ,此过程踩坑无数,特此记录一下跳坑过程.顺便开了另一个相关的小项目,欢迎 start 和 fork: BLE ...

  5. 微信小程序缓存滑动距离,当页面浏览到一定位置,滑动其他页面后返回该页面记录之前的滑动距离

    15.微信小程序缓存滑动距离 我们在浏览页面的时候,然后左滑或者右滑到新的页面,等返回此页面,我们希望可以记录上次滑动的距离 虽然这个实现起来并不难,但是会遇到一些坑,因为scroll-view的组件 ...

  6. .net mvc 站点自带简易SSL加密传输 Word报告自动生成(例如 导出数据库结构) 微信小程序:动画(Animation) SignalR 设计理念(一) ASP.NET -- WebForm -- ViewState ASP.NET -- 一般处理程序ashx 常用到的一些js方法,记录一下 CryptoJS与C#AES加解密互转

    .net mvc 站点自带简易SSL加密传输   因项目需要,传输数据需要加密,因此有了一些经验,现简易抽出来分享! 请求:前端cryptojs用rsa/aes 或 rsa/des加密,后端.net ...

  7. 记录微信小程序里自带 时间格式 工具

    微信小程序里面自己给了一个时间工具,是用来记录log日志,感觉可以记录下来,所以拿来自己用,以此记录: 直接传入 日期对象 进入 formatTime //得到下面格式的时间格式2017/07/22 ...

  8. 记录一次用宝塔部署微信小程序Node.js后端接口代码的详细过程

    一直忙着写毕设,上一次写博客还是元旦,大半年过去了.... 后面会不断分享各种新项目的源码与技术.欢迎关注一起学习哈! 记录一次部署微信小程序Node.js后端接口代码的详细过程,使用宝塔来部署. 我 ...

  9. 微信小程序开发 记录

    采坑了 微信小程序--TabBar不出现的一种原因 学习微信小程序中,遇到底部的TabBar不出现的问题.经过多番尝试,终于解决问题.在此记录问题产生的原因和对策.下面先描述错误现象,接着指出错误原因 ...

  10. 微信小程序语音识别开发过程记录 微信小程序silk转mp3 silk转wav 以及ffmpeg使用

    说说最近在开发微信小程序语音识别遇到的问题吧 最先使用微信小程序录音控件可以拿到silk格式,后来微信官方又支持mp3格式了 但是我们拿到这些格式以后,都还不能直接使用,做语音识别,因为目前百度的语音 ...

随机推荐

  1. 在IIS上部署.net core的webapi项目 以及502.5错误的两种解决方法

    首先要在服务器上面安装.net core https://github.com/dotnet/core/tree/master/release-notes/download-archives 这里面有 ...

  2. Windows10的Ubuntu子系统开启桌面环境

    原文:Windows10的Ubuntu子系统开启桌面环境 Ubuntu 优势之一就是桌面环境比较好,所以咱们的子系统当然也不能少了这一环节,本小结开始安装Ubuntu 桌面系统. 安装环境 使用下面指 ...

  3. 《Silk》(皇家律师)—— 英美海洋法系

    Abortion Act:堕胎法: 1. 表达习惯 we employ him, not the other way round, Officially,-,官方的说法是,Unofficially,- ...

  4. C++异常处理入门

    引言 异常,让一个函数可以在发现自己无法处理的错误时抛出一个异常,希望它的调用者可以直接或者间接处理这个问题.而传统错误处理技术,检查到一个局部无法处理的问题时: 1.终止程序(例如atol,atoi ...

  5. Ubuntu 14.04 64位字体美化(使用黑文泉驿)

    Ubuntu 14.04安装和升级后,,斜体字体变得很难看,昨天,我得到一个晚上,最终,管理一个线索,这里整洁. 在线调研后,.一致的观点是,,使用开源字体库文泉驿理想的黑色字体效果,效果甚至没有丢失 ...

  6. rc-form(翻译)

    原地址:https://npm.taobao.org/package/rc-form rc-form React 高阶表单控制组件.       开发 npm install npm start op ...

  7. 关于Hibernate中hbm2java和hbm2ddl工具

    hbm2java:根据映射文件自动生成java源文件 hbm2ddl:根据映射文件自动生成数据库的schema XDoclet:根据带有XDoclet标记的java源文件生成映射文件 Middlege ...

  8. 树莓派3B 无显示器,无键盘,无Linux系统,无网线 配置WIFI连接

    #1.基本需求#2.烧写镜像#3.用有线网(网线)连接PC,实现远程操作树莓派#4.接入无线网,通过其它电脑远程控制树莓派#5.使用PC共享的热点Wifi远程控制树莓派 #1.基本需求 树莓派 USB ...

  9. wpf的webbrowser与javascript交互

    JS调用C#代码 HTML代码: <button onclick="window.external.Test('called from script code')"> ...

  10. comtextMenu 如何正确的响应MouseLeave事件

    今天给菜单加上这个事件,发现弹出菜单后 鼠标怎么动都不会触发 mouseLeave事件 解决方法是 在菜单loaded事件中,利用visualTreeHelper 访问他内部的border控件,把这个 ...