一、获取各种值
设置data值：
xx.js
Page({
data: {
text: "This is page data.",
sliderOffset: 0,
sliderLeft: 0,
state:{
genre:[],
genre_index: 0,
model:[],
model_index: 0,
terminalStatus:'',
}
},
this.setData({})设置值
this.setData({
'state.genre_index':1,//注意引号
text:'data value'
})
获取data中的text和genre_index值需要使用this
var gener_index=this.data.state.genre_index
var text=this.data.text
调用点击函数
在点击函数中调用内部的函数drawBall()可以直接调用，如果需要在onReady函数中调用点击函数需要使用this。
onReady: function () {
this.drawBall()
},
获取数组中某个变量的值：
var id = event.currentTarget.dataset.id;
var a = that.data.teacherInfo[id].decoration;
获取自定义属性 data-id 的值:
event.currentTarget.dataset.id
通过e.currentTarget.id;获取设置的id值，并通过设置全局对象的方式来传递数值，
获取全局对象 var app=getApp(); //设置全局的请求访问传递的参数 app.requestDetailid=id;
小程序获取页面传值id 的值:
onLoad: function (options) {
var that = this
var articleId = options.id//获取文章的id值
},
小程序获取input框输入: bindinput事件中获取数据
wxml:
<input type="number" placeholder="请输入手机号" bindinput="bindPhone" maxlength="11"/>
js:
bindPhone:function(e){
this.setData({
phone:e.detail.value
})
},
小程序获得表单value值：bindsubmit事件或在每一个input中填写bindconfirm="xxConfirm"等事件
wxml：
<form bindsubmit="formSubmit">
<input name="detail" placeholder="详情地址" />
<input name="realname" placeholder="收件人姓名" />
<input name="mobile" placeholder="手机号码" type="number"/>
<button formType="submit" type="primary">Submit</button>
</form>
js：
formSubmit: function(e) {
// detail
var detail = e.detail.value.detail;
// realname
var realname = e.detail.value.realname;
// mobile
var mobile = e.detail.value.mobile;
}
二、页面间传递数据
全局变量之中传递参数数据
在微信小程序的开发过程之中，需要从A页面跳转到B页面，并且把A页面的数据传递到B页面使用。可以使用全局变量使用的方法，微信小程序官方提供app.js全局变量定义文件，里面可以定义需要在全局需要使用的变量与及变量值，例如用户登录之后，需要在所有页面中使用用户登录状态等。
微信小程序初始化时，首先会加载app.json全局样式配置文件和全局变量文件，例如下面的globalData变量。
在app.js定义全局变量后，可以在各页面间直接加载全局变量，小程序提供了getApp()方法，可以直接获取到App({…})这个全局实例对象。
App({
/**
* 当小程序初始化完成时，会触发 onLaunch（全局只触发一次）
*/
onLaunch: function () {
},
/**
* 当小程序启动，或从后台进入前台显示，会触发 onShow
*/
onShow: function (options) {
},
/**
* 当小程序从前台进入后台，会触发 onHide
*/
onHide: function () {
},
/**
* 当小程序发生脚本错误，或者 api 调用失败时，会触发 onError 并带上错误信息
*/
onError: function (msg) {
}，
//全局变量
globalData：{
userInfo：null
}
})
//page/index/index
var app=getApp();//取得全局App({..})实例
var userInfo=app.globalData.userInfo;//取得全局变量需要的值
使用本地缓存的方法保存全局变量,本地缓存是有存储限制的，所以建议手动删除不再需要的缓存数据。
假如在A页面保存需要的信息,如下图就可以直接保存键名为cargo的数据。
var cargo={
id:'12345',
count:2,
name:'xx书籍',
price:85,
picUrl:'http://image/kiwis.com/gfdscvbwerdcdgqd.jpg'
};
wx.setStorage({
key:"cargo",
data:cargo
})
在B页面直接可以使用小程序的wx.getStorage并传入要获取到的键值名就可以获取本地缓存的数据。
wx.getStorage({
key: 'cargo',
success: function(res) {
console.log(res.data)
}
})
通过在跳转、重定向等转变页面时候，可以直接通过url来传送数据。
在A页面传递数据到B页面中使用的时候可以直接使用以下数据。
//page A
wx.navigateTo({
url: 'test?id=1'
})
//or page A
wx.redirectTo({
url: 'test?id=1'
})
// or page A
wx.reLaunch({
url: 'test?id=1'
})
//page B
Page({
onLoad: function(option){
console.log(option.query)
}
})
wx.navigateTo和wx.redirectTo不能跳转到tabar定义的页面，查看了微信小程序提供了wx.switchTab进行跳转，但是switchTab不可以传递url参数，后面提供了wx.reLaunch函数。
往组件模板之中传递数据，可以直接在模板的data-*中传递数据。
<template is="模板名" data="数据对象"/>
通过页面栈获取到上一页面对数据进行修改
假设从A页面跳转到B页面，而B页面需要对A页面的数据进行修改处理。
//pageA
page({
data:{
user:kiwis
}
})
//pageB
page({
updateData:function(){
var pages=getCurrentPages();
var prevPage=pages[pages.length-2];
prevPage.setData({
user:'LaternKiwis'
})
}
})
对于全局变量的，也可以直接通过第三方服务器用数据库进行保存，是要使用的时候直接从数据库里面直接读取全局变量。
使用wx.request提交与读取数据
//提交数据给第三方服务器进行插入缓存数据库处理
wx.request({
url: 'test.php', //仅为示例，并非真实的接口地址
data: {
username:'kiwis',
gender:1,
picUrl:'http://image/kiwis.com/gfdscvbwerdcdgqd.jpg'
},
method:'POST',
header: {
'content-type': 'application/json'
},
success: function(res) {
console.log(res.data)
}
})
//从缓存数据库读取数据
wx.request({
url: 'test.php', //仅为示例，并非真实的接口地址
data: {
username:'kiwis'
},
method:'GET',
header: {
'content-type': 'application/json'
},
success: function(res) {
console.log(res.data)
}
})
在使用url进行参数传递时候，传递数据有字节限制；详情可以查阅微信小程序的文档；在使用url传参数数据时候，如果传送的参数值是一个json数据，要使用JSON.stringify对json对象转换成字符串的形式；在开发小程序过程中，使用Nodejs获取传递的参数时，没有经过字符串序列化，在后台获取不到参数值，显示为null。所以需要JSON.stringify,然后在后台逻辑之中使用JSON.parse序列化成对象使用。
小程序通过wx.navaigaTo跳转到具体的页面，并传递相关联的参数数据过去案例如下，class为item的view绑定了tap事件，传递数据通过data- 来定义*(*是自定义的储存数据变量值，其中的item是真实数据)例如wxml页面如下所示：
<view class="container">
<view class="item" wx:for="{{items}}" data-video="{{item}}" bindtap="play">
<image src="{{item.image_url}}" class="newsPic"></image>
<view class="source">
<text>{{item.source}}</text>
<text class="count">评论 {{item.comments_count}}</text>
</view>
<view class="icon" >
<text>{{item.title}}</text>
<image src="../../images/{{path}}" class="play"></image>
</view>
</view>
</view>
在wx的js文件中，通过play事件通过下面的方式传递数据,通过event.currentTarget.dataset获取我们自定义的video变量:
play:function(event){
var video = event.currentTarget.dataset.video;
console.log(video)
// this.setData({
// path:'play.png'
// })
wx.navigateTo({
url: '../logs/logs?imgUrl=' + video.image_url + '&source_url=' + video["source_url"] + "&title=" + video.title + "&group_id=" + video["group_id"]
})
}
在要接收上一页面传递过来的数据的页面通过onLoad事件的options参数里面包含了上一页面所有传递过来的参数数据，可以通过下面的方式进行获取。
onLoad:function(options){
var that=this
that.setData({
imgUrl:options.imgUrl,
title:options.title,
videoSrc:options.videoSrc,
group_id:options["group_id"]
})
},
三、 wxml 页面组件跳转（可以通过设置open-type属性指明页面跳转方式）：
// navigator 组件默认的 open-type 为 navigate
<navigator url="/page/navigate/navigate?title=navigate" hover-class="navigator-hover">跳转到新页面</navigator>
// redirect 对应 API 中的 wx.redirect 方法
<navigator url="../../redirect/redirect/redirect?title=redirect" open-type="redirect" hover-class="other-navigator-hover">在当前页打开</navigator>
// switchTab 对应 API 中的 wx.switchTab 方法
<navigator url="/page/index/index" open-type="switchTab" hover-class="other-navigator-hover">切换 Tab</navigator>
// reLanch 对应 API 中的 wx.reLanch 方法
<navigator url="../../redirect/redirect/redirect?title=redirect" open-type="redirect" hover-class="other-navigator-hover">关闭所有页面，打开到应用内的某个页面</navigator>
// navigateBack 对应 API 中的 wx.navigateBack 方法
<navigator url="/page/index/index" open-type="navigateBack" hover-class="other-navigator-hover">关闭当前页面，返回上一级页面或多级页面</navigator>