9月24日知识点记录

一.微信获取收获地址

if(wx.chooseAddress){
 wx.chooseAddress({
  success: function (res) {
   console.log(JSON.stringify(res))
  },
  fail: function(err){
   console.log(JSON.stringify(err))
  }
 })
}else{
 console.log('当前微信版本不支持chooseAddress');
}

二.验证，上传图片，跳转小程序

var config = require('../../config.js');
Page({
  data: {
    imgUrls: [
      config.remote_img_uri + '1.jpg',
      config.remote_img_uri + '2.jpg',
      config.remote_img_uri + '3.jpg',
      config.remote_img_uri + '4.jpg',
      config.remote_img_uri + '5.jpg',
      config.remote_img_uri + '6.jpg',
      config.remote_img_uri + '7.jpg',
      config.remote_img_uri + 'fm1.jpg',
      config.remote_img_uri + 'fm2.jpg'
    ],
    videoUrls: [
      config.remote_video_uri + 'bd-jtjy.mp4',
      config.remote_video_uri + 'xyfx-jtyj.mp4'
    ],
    img: config.remote_img_uri,
    video: config.remote_video_uri
  },
  // 转入
  onLoad: function () {
  },
  // 打电话
  callMe: function (e) {
    wx.makePhoneCall({
      phoneNumber: '03543060680'
    })
  },
  // 转发
  onShareAppMessage: function () {
    return {
      title: '教育部家庭教育指导师报名',
      path: '/pages/video/video',
      success: function (res) {
        // 转发成功
        // console.log('success', '<<<' + res + '>>>');
      },
      fail: function (res) {
        // 转发失败
        // console.log('error', '<<<' + res + '>>>');
      }
    }
  },
  // 图片预览
  imagePrivew: function (e) {
    var nowImg = config.remote_img_uri + e.target.id;
    // console.log(e, nowImg, this.data.imgUrls);
    wx.previewImage({
      urls: this.data.imgUrls,
      current: nowImg
    })
  },
  //跳转小程序
  onjumpzixun: function (e) {
    wx.navigateToMiniProgram({
      appId: '',
    })
  },
  onjumpxinli: function (e) {
    wx.navigateToMiniProgram({
      appId: '',
    })
  },
  // 跳转教材  
  bindBook: function () {
    navigate('wxf326ae804d2dd5fa',
      'pages/orderbook/orderbook');
  },
  // 跳转报名
  bindReg: function () {
    navigate('wxf326ae804d2dd5fa',
      'pages/index/index');
  },
  // 跳转视频课程
  bindVideo: function () {
    navigate(
      'wx674a5b329cbb70ac',
      'pages/index/index');
  }
})

三.未知方法

 //app.js
const config = require('config');
const md5 = require('utils/md5');
const util = require('utils/util');
import wxValidate from 'utils/wxValidate';

/**
 *  对参数签名 
 * */
function checkInParam(param) {
  var str_param = '';
  // 参数数组
  var paramObj = {};

  if (typeof param == "object") {
    var param_keys = Object.keys(param);
    if (param_keys == "") return false;

var sort_params = param_keys.sort();
for (var i in sort_params) {
  // 参数拼接
  str_param += sort_params[i] + '=' + param[sort_params[i]] + '&';
}

str_param = str_param.substr(0, str_param.length - 1);

// 加入参数数组
paramObj = param;
  }
  var time = util.formatTime(new Date());
  var signature = md5(str_param + time + config.key);
  // console.log(str_param, signature);

  paramObj.app = config.app;
  paramObj.signature = signature;
  paramObj.time = time;
  paramObj.version = config.version;

  return paramObj;
}
/**
 * 解参数
 * --------
 * 转换前：
 * a=1&b=2
 * 
 * 转换后：
 * {
 *  a : 1,
 *  b : 2
 * }
 */
function decodeParam(str_param) {
  var param = {};
  var sp = str_param.split('&');
  for (var i in sp) {
    var pop = sp[i].split('=');
    param[pop[0]] = pop[1];
  }
  return param;
}
/**
 * 远程请求
 */
function request(req) {
  wx.showLoading({
    title: '加载中...',
  })
  var url = req.url ? config.remote_uri + req.url : '';
  var method = req.method ? req.method : 'POST';
  var data = req.data ? req.data : '';
  var param = checkInParam(data);
  // console.log(data, param);
  wx.request({
    url: url,
    method: method,
    data: param,
    dataType: 'json',
    header: {
      'content-type': 'application/json'
    },
    success: function (res) {
      // console.log('success >>> ', res)
      typeof req.success == "function" && req.success(res)
    },
    fail: function (e) {
      // console.log('fail >>> ', e)
      typeof req.fail == "function" && req.fail(e)
    },
    complete: function () {
      wx.hideLoading();
    }
  })
}
App({
  WxValidate: (rules, messages) => new wxValidate(rules, messages),
  onLaunch: function () {
  },
  getUserInfo: function (cb) {
    var that = this
    if (this.globalData.userInfo) {
      typeof cb == "function" && cb(this.globalData.userInfo)
    } else {
      //调用登录接口
      wx.login({
       success: function (loginData) {
          // console.log('in WX-Login success', loginData);
          // 获取用户信息
          wx.getUserInfo({
        withCredentials: true,
        success: function (res) {
          // console.log('in WX-GetUserInfo success', res.userInfo);

          // 服务器端获取用户openid
          var info = res.userInfo;
          info['code'] = loginData.code;
          if (loginData.code) {
            // console.log('已发起网络请求');
            //发起网络请求
            request({
              url: '/login',
              data: info,
              success: function (loginRes) {
                // console.log(loginRes);
                if (loginRes.data.status !== 200) return false;

                try {
                  wx.setStorageSync('guid', loginRes.data.guid);
                } catch (e) {
                  // console.log('setStoageSync GUID Error :', e);
                }
              }
            })
          } else {
            // console.log('获取用户登录态失败！' + loginData.errMsg)
          }
          // 回调
          that.globalData.userInfo = res.userInfo
             typeof cb == "function" && cb(res.userInfo)
            },
            fail: function (e) {
          wx.openSetting({
            success: function (data) {
              if (data.authSetting["scope.userInfo"] == true) {
                wx.getUserInfo({
                  withCredentials: true,
                  success: function (res) {
                    // console.log('in openSetting WX-GetUserInfo success', res.userInfo);

                    // 服务器端获取用户openid
                    var info = res.userInfo;
                    info['code'] = loginData.code;
                    if (loginData.code) {
                      // console.log('已发起网络请求');
                      //发起网络请求
                      request({
                        url: '/login',
                        data: info,
                        success: function (loginRes) {
                          // console.log(loginRes);
                          if (loginRes.data.status !== 200) return false;

                          try {
                            wx.setStorageSync('guid', loginRes.data.guid);
                          } catch (e) {
                            // console.log('setStoageSync GUID Error :', e);
                          }
                        }
                      })
                    } else {
                      // console.log('获取用户登录态失败！' + loginData.errMsg)
                    }
                        that.globalData.userInfo = res.userInfo
                        typeof cb == "function" && cb(res.userInfo)
                      },
                      fail: function (res) {
                        // console.log('in openSetting WX-GetUserInfo fail', res);
                      }
                    });
                  }
                },
                fail: function (e) {
                  // console.log('in openSetting fail', e);
                }
              });
              // console.log('in WX-GetUserInfo fail', e);
            }
          })
        }
      })
    }
  },
  globalData: {
    userInfo: null
  },
  // 分享
  share: function () {
    // 转发
    return {
      title: '心理咨询师全国代报名',
      path: '/pages/index/index',
      success: function (res) {
        // 转发成功
    // console.log('success', '<<<' + res + '>>>');
      },
      fail: function (res) {
        // 转发失败
        // console.log('error', '<<<' + res + '>>>');
      }
    }
  },
  // 电话
  call: function () {
    wx.makePhoneCall({
      phoneNumber: '03543060680'
    })
  },
  // 远程请求
  request: function (req) {
    request(req);
  }
})

四.图片验证并加载显示
1.页面

<view class='box'>
<view class='head'>家庭教育指导师报名表</view>
<view class='content'>
<form catchsubmit="formSubmit" bindreset='formReset' report-submit="true">
<view class="page-section page-section-gap">
<view class='style page-section-name' bindfocus='changestyle'>姓名
<text class='red_str'></text>
</view>
<input class='section_name' name="realname" type="text" />
<view class='error' hidden='{{realnameStatus}}'>{{realnameTip}}</view>
<view class="style page-section-sex">性别
<text class='red_str'></text>
<radio-group name="sex" bindchange="changesex">
<label class='radio'>
<radio class='section-sex' value="1" />男</label>
<label class='radio'>
<radio class='section-sex' value="2" checked="true" />女</label>
</radio-group>
<view class='error' hidden='{{sexStatus}}'>{{sexTip}}</view>
</view>
<view class="error-tip" hidden="{{levelStatus}}">{{levelTip}}</view>
</view>
<view class='style page-section-phone'>联系方式
<text class='red_str'></text>
</view>
<input name='phone' class='section_phone' type="number" />
<view class='error' hidden='{{phoneStatus}}'>{{phoneTip}}</view>
<view class='style page-section-image'>身份证正面
<text class='red_str'></text>
<view>
<text class='hint'>支持 jpg, png, gif, bmp, psd, tiff 等图片格式</text>
</view>
</view>
<image class='img_btn' data-id="imgOne" bindtap='getimage' src='{{ imgOne ? imgOne : plusImg }}'></image>
<input type='text' hidden='true' name='imgOne' value='{{imgOneValue}}' />
<view class='error' hidden='{{imgOneStatus}}'>{{imgOneTip}}</view>

  <view class='style page-section-image'>身份证反面
    <text class='red_str'>*</text>
    <view>
      <text class='hint'>支持 jpg, png, gif, bmp, psd, tiff 等图片格式</text>
    </view>
  </view>
  <image class='img_btn' data-id="imgTwo" bindtap='getimage' src='{{ imgTwo ? imgTwo : plusImg }}'></image>
  <input type='text' hidden='true' name='imgTwo' value='{{imgTwoValue}}' />
  <view class='error' hidden='{{imgTwoStatus}}'>{{imgTwoTip}}</view>

  <view class='style page-section-image'>最高学历毕业证
    <text class='red_str'>*</text>
    <view>
      <text class='hint'>支持 jpg, png, gif, bmp, psd, tiff 等图片格式</text>
    </view>
  </view>
  <image class='img_btn' data-id="imgThree" bindtap='getimage' src='{{ imgThree ? imgThree : plusImg }}'></image>
  <input type='text' hidden='true' name='imgThree' value='{{imgThreeValue}}' />
  <view class='error' hidden='{{imgThreeStatus}}'>{{imgThreeTip}}</view>

  <view class='style page-section-image'>二寸红底照片
    <text class='red_str'>*</text>
    <view>
      <text class='hint'>支持 jpg, png, gif, bmp, psd, tiff 等图片格式</text>
    </view>
  </view>
  <image class='img_btn' data-id='imgFour' bindtap='getimage' src='{{ imgFour ? imgFour : plusImg }}'></image>
  <input type='text' hidden='true' name='imgFour' value='{{imgFourValue}}' />
  <view class='error' hidden='{{imgFourStatus}}'>{{imgFourTip}}</view>

  <input type='text' hidden='true' name='type' value='4'></input>
  <view class="btn_area">
    <button class='sub' hidden='{{ hidden }}' form-type='submit' bindtap="setHidden">提交</button>
  </view>
</form>

</view>
</view>

二.小程序后台代码
`const config = require("../../config.js");
const qiniuUploader = require("../../utils/qiniuUploader");

// 初始化七牛相关参数
function initQiniu() {
var options = {
region: 'SCN', // 华南区
uptokenURL: 'https://51nst.yunfeng365.com/upToekn',
domain: config.remote_upload_uri,
shouldUseQiniuFileName: false
};

qiniuUploader.init(options);
}
/**

设置验证字段
*/
function setValidate(obj) {
obj.WxValidate = app.WxValidate(
{
realname: {
required: true
},
sex: {
required: true
},
phone: {
required: true,
tel: true,
digits: true,

},
imgOne: {
required: true
},
imgTwo: {
required: true
},
imgThree: {
required: true
},
imgFour: {
required: true
},
}, {
realname: {
required: '姓名不能为空',
min: '姓名最少为二位',
},
sex: {
required: '性别不能为空'
},
phone: {
required: '联系方式不能为空',
tel: '请输入正确电话号码',
digits: '电话号为数字'
},
imgOne: {
required: '图片不能为空'
},
imgTwo: {
required: '图片不能为空'
},
imgThree: {
required: '图片不能为空'
},
imgFour: {
required: '图片不能为空'
}
}
);
}

// pages/res/res.js
var app = getApp();

Page({
/**

页面的初始数据
*/
data: {
plusImg: '/image/plus.png',
hidden: false
},
getimage: function(e){
// 初始化七牛配置
initQiniu();

//异步方法
var that = this;
//获取点击上传后的ID名
var obj = e.currentTarget.dataset.id;

wx.chooseImage({
  count: 1, // 默认9
  sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图，默认二者都有
  sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机，默认二者都有
  success: function (res) {

    // 返回选定照片的本地文件路径列表，tempFilePath可以作为img标签的src属性显示图片
    var tempFilePaths = res.tempFilePaths
    // console.log(tempFilePaths);
    //动态获取1.定义数组存放
    // var data = {};
    //获取下标为0的文件路径
    tempFilePaths = tempFilePaths[0];
    // that.setData(data);

    // 交给七牛上传  tempFilePaths默认取0  提交成功upRes
    qiniuUploader.upload(tempFilePaths, (upRes) => {
      // console.log(upRes);
      // 修改数据
      //定义数组存放收到的文件路径
      var data = {};
      // data[nowImg] = upRes.imageURL;
      // data[nowTvalue + 'ShowLoading'] = false;
      //data[id名] = 获取到的文件路径 
      data[obj] = tempFilePaths;
      //data[ID+值] = 获取到的图片路径
      data[obj+'Value'] = upRes.imageURL;
      //设置数据data 
      that.setData(data);
    }, (error) => {
    }
    );
  }
})

onLoad: function (e) {
// 表单验证初始化
setValidate(this);
},

/**

页面上拉触底事件的处理函数
*/
onReachBottom: function () {

// 提交表单
formSubmit: function (e) {
var that = this
var meInfo = this.data.userInfo;
var requestValue = e.detail.value;
var formId = e.detail.formId;
console.log(requestValue);

// 去掉提示
var data = {};
for (var i in requestValue) {
  var status = i + 'Status';
  data[status] = true;
}
this.setData(data);

//提交错误描述
if (!this.WxValidate.checkForm(e)) {
  data = {};
  var errs = this.WxValidate.errorList;
  for (var i in errs) {
    var tip = errs[i].param + 'Tip';
    var status = errs[i].param + 'Status';
    var msg = errs[i].msg;

    data[tip] = msg;
    data[status] = false;
  }
  console.log(data);
  this.setData(data);
  return false
}

// remote request
app.request({
  url: '/bm/store',
  data: requestValue,
  success: function(res){
    console.log(res);
    if (res.statusCode == 200)
    {
      wx.showModal({
        title: '提示',
        content: res.data.msg,
      })         
      return ;
    }
    wx.showModal({
      title: '提示',
      content: '服务器繁忙请稍后',
    })
  },
  fail: function(err) {
    console.log(err);
    wx.showModal({
      title: '提示',
      content: '服务器繁忙请稍后',
    })
  }
});

},
//提交成功后按钮隐藏
setHidden: function (e) {
this.setData({
hidden: true
})
},
// 重置数据并提示
// formReset: function () {
// wx.showToast({
// title: '提交成功'
// // duration: 0,
// // mask: true,
// // success: function(res) {},
// // fail: function(res) {},
// // complete: function(res) {},
// })
// console.log('form发生了reset事件')
// }
})·
五.其他知识点总结
{
"navigationBarTitleText": "心理学兴趣班报名表"
}
提交后隐藏按钮

最后编辑于：2017.12.10 16:37:17

人面猴
序言：七十年代末，一起剥皮案震惊了整个滨河市，随后出现的几起案子，更是在滨河造成了极大的恐慌，老刑警刘岩，带你破解...
沈念sama阅读 216,496评论 6赞 501
死咒
序言：滨河连续发生了三起死亡事件，死亡现场离奇诡异，居然都是意外死亡，警方通过查阅死者的电脑和手机，发现死者居然都...
沈念sama阅读 92,407评论 3赞 392
救了他两次的神仙让他今天三更去死
文/潘晓璐我一进店门，熙熙楼的掌柜王于贵愁眉苦脸地迎上来，“玉大人，你说我怎么就摊上这事。” “怎么了？”我有些...
开封第一讲书人阅读 162,632评论 0赞 353
道士缉凶录：失踪的卖姜人
文/不坏的土叔我叫张陵，是天一观的道长。经常有香客问我，道长，这世上最难降的妖魔是什么？我笑而不...
开封第一讲书人阅读 58,180评论 1赞 292
港岛之恋（遗憾婚礼）
正文为了忘掉前任，我火速办了婚礼，结果婚礼上，老公的妹妹穿的比我还像新娘。我一直安慰自己，他们只是感情好，可当我...
茶点故事阅读 67,198评论 6赞 388
恶毒庶女顶嫁案：这布局不是一般人想出来的
文/花漫我一把揭开白布。她就那样静静地躺着，像睡着了一般。火红的嫁衣衬着肌肤如雪。梳的纹丝不乱的头发上，一...
开封第一讲书人阅读 51,165评论 1赞 299
城市分裂传说
那天，我揣着相机与录音，去河边找鬼。笑死，一个胖子当着我的面吹牛，可吹牛的内容都是我干的。我是一名探鬼主播，决...
沈念sama阅读 40,052评论 3赞 418
双鸳鸯连环套：你想象不到人心有多黑
文/苍兰香墨我猛地睁开眼，长吁一口气：“原来是场噩梦啊……” “哼！你这毒妇竟也来了？” 一声冷哼从身侧响起，我...
开封第一讲书人阅读 38,910评论 0赞 274
万荣杀人案实录
序言：老挝万荣一对情侣失踪，失踪者是张志新（化名）和其女友刘颖，没想到半个月后，有当地人在树林里发现了一具尸体，经...
沈念sama阅读 45,324评论 1赞 310
护林员之死
正文独居荒郊野岭守林人离奇死亡，尸身上长有42处带血的脓包…… 初始之章·张勋以下内容为张勋视角年9月15日...
茶点故事阅读 37,542评论 2赞 332
白月光启示录
正文我和宋清朗相恋三年，在试婚纱的时候发现自己被绿了。大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
茶点故事阅读 39,711评论 1赞 348
活死人
序言：一个原本活蹦乱跳的男人离奇死亡，死状恐怖，灵堂内的尸体忽然破棺而出，到底是诈尸还是另有隐情，我是刑警宁泽，带...
沈念sama阅读 35,424评论 5赞 343
日本核电站爆炸内幕
正文年R本政府宣布，位于F岛的核电站，受9级特大地震影响，放射性物质发生泄漏。R本人自食恶果不足惜，却给世界环境...
茶点故事阅读 41,017评论 3赞 326
男人毒药：我在死后第九天来索命
文/蒙蒙一、第九天我趴在偏房一处隐蔽的房顶上张望。院中可真热闹，春花似锦、人声如沸。这庄子的主人今日做“春日...
开封第一讲书人阅读 31,668评论 0赞 22
一桩弑父案，背后竟有这般阴谋
文/苍兰香墨我抬头看了看天上的太阳。三九已至，却和暖如春，着一层夹袄步出监牢的瞬间，已是汗流浃背。一阵脚步声响...
开封第一讲书人阅读 32,823评论 1赞 269
情欲美人皮
我被黑心中介骗来泰国打工，没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留，地道东北人。一个月前我还...
沈念sama阅读 47,722评论 2赞 368
代替公主和亲
正文我出身青楼，却偏偏与公主长得像，于是被迫代替她去往敌国和亲。传闻我的和亲对象是个残疾皇子，可洞房花烛夜当晚...
茶点故事阅读 44,611评论 2赞 353

9月24日知识点记录

推荐阅读更多精彩内容