小程序 （四）
一、小程序中需要使用类似于vue的v-for该如何使用
wx:for="{{orderList}}" wx:for-item="item" wx:for-index="index" wx:key="orderListId"
orderList:[{
imgSrc: "../../image/orderIcon.png",
index: 0,
title: "XXXX"
},{
imgSrc: "../../image/order.png",
index: 1,
title: "XXXX"
},{
imgSrc: "../../image/campIcon.png",
index: 2,
title: "XXXXX"
}],
这里如果不写wx:key,就会报以下警告warning： Now you can provide attr "wx:key" for a "wx:for" to improve performance.
在循环体中要使用imgSrc就需要写 src="{{item.imgSrc}}"
二、通过点击事件传递参数
<view class="flex-item" wx:for="{{orderList}}" wx:for-item="item" wx:for-index="index" wx:key="orderListId" bindtap='linkToOrder' data-index="{{item.index}}">
这样写在js文件里，就可以这样写
linkToOrder: function(e) {
console.log(e.currentTarget.dataset.index)
console.log(e);
}
就能拿到这个值
如果只要传递一个值，那么不需要借助data-
可以用Id代替
<view class="flex-item" wx:for="{{orderList}}" wx:for-item="item" wx:for-index="index" wx:key="orderListId" bindtap='linkToOrder' data-index="{{item.index}}" id="{{item.imgSrc}}">
接收的时候代码如下
console.log(e.currentTarget.id);
其中有几个要注意的，
data-后面加的名称不能有大写字母，如果想要用这个，可以用-连接单词，在js使用的时候可以直接把第二个单词首字母自动大写。data-这个里面是不可以存放对象的。
event中里面有两个，一个是target一个是currentTarget
前者触发事件的源组件，后者绑定当前组件。
当你在父元素上绑定了事件传参，那么点击父元素，currentTarget,target都可以拿到参数，如果你点的是子元素，那么，target就不是事件绑定的元素，就拿不到参数。因为有事件冒泡，
由于事件冒泡的机制，父元素上绑定的事件依然可以触发，所以currentTarget 可以拿到参数。
三、小程序页面的跳转
小程序跳转有多个方法
（1）wx.navigateTo 保留当前页面，跳转到应用内的某个页面，使用wx.navigateBack可以返回到原页面
linkToOrder: function(e) {
var index = e.currentTarget.dataset.index;
if( index == 1){
wx.navigateTo({
url: '../travelOrder/travelOrder?id=' + index + '&test=20',
})
}
},
这个时候要跳转过去的页面，通过这个可以接受页面传过来的值
onLoad: function (options) {
console.log(options)
},
（2）wx.redirectTo关闭当前页面，跳转到应用内的某个页面。
wx.redirectTo({
url: '../travelOrder/travelOrder?id=' + index + '&test=20',
})
（3）wx.switchTab跳转到tabBar页面，同时关闭其他非tabBar页面
wx.switchTab({
url: '../travelOrder/travelOrder',
})
（4）wx.reLanch关闭所有页面，打开到应用内的某个页面
wx.reLanch({
url: '../travelOrder/travelOrder?id=' + index + '&test=20',
})
（5）<navigator></navigator>
<view class='flex-item clearfix' wx:for="{{msgList}}" wx:for-item="item" wx:for-index="index" wx:key="msgListId" bindtap="linkToMe">
<navigator url='../travelOrder/travelOrder?id={{item.imgSrc}}&test=20'>
</navigator>
</view>
四、小程序左上角的返回键
1.把该页面设置为tab页面或者主页;
2.进入该页面使用wx.reLaunch();
wx.reLaunch({
url:'../orderList/orderList',
})
但是它会销毁其它所有的页面。
