微信小程序开发
1. data-*
data-* 属性是用于存储页面或应用程序的私有自定义数据，存储的数据能够被页面的JavaScript中使用,也是HTML5才有的新属性。
(1)在wxml文件中通过添加data-属性来传递我们需要的值
<view class="mood-item" data-id="{{item.id}}" bindtap="moodDetail"></view>
(2)在js文件中获取值
moodDetail: function (e) {
var data = e.currentTarget.dataset;
var id = data.id;
}
2. 通过navigator传递参数
(1)在navigator的url中添加需要传递的值
- 在wxml文件中，通过控件
<navigator />
<navigator url="../moodDetail/moodDetail?id={{item.id}}" ></navigator>
- 在js文件中，通过api:wx.navigateTo()
moodDetail: function (e) {
var data = e.currentTarget.dataset;
wx.navigateTo({
url: '../moodDetail/moodDetail?id='+data.id
})
}
(2)在跳转的页面获取值
onLoad:function(options){
// 生命周期函数--监听页面加载
console.log("onLoad======");
var id = options.id;
}
3. 页面间实现通信
大家可能会遇到这样的需求：通过A页面进入到B页面，B页面操作成功后需要返回A页面并刷新A页面的数据，这就涉及到页面之间的通信。具体可以用以下方法实现：
(1)在A页面定义一个函数
refresh: function (isRefresh) {
that.setData({
isRefresh:isRefresh
})
}
(2)在B页面通过getCurrentPages()得到A页面的实例
success: function(){
var pages = getCurrentPages();
if(pages.length >1) {
var prePage = pages[pages.length-2];
prePage.refresh(true);
}
}
得到A页面的实例然后调用这个函数，这里传入布尔值true.
(3)在A页面判断isRefresh的值从而实现刷新
分析小程序的页面生命周期我们可以得知B页面跳转到A页面调用的是onShow()方法，所以将刷新逻辑写在该方法中。
onShow:function(){
// 生命周期函数--监听页面显示
console.log("onShow======");
if(that.data.isRefresh == true) {
that.onReady();//这里onReady()方法中加载数据，所以直接调用onReady()
}
that.setData({
isRefresh:false
});
}
4. 在模拟器上可以实现但真机无法实现
(1)下拉刷新在真机上无效
在模拟器上试验多次可以正确的实现下拉刷新，但是真机上测试却是始终无法实现，真是一脸懵逼啊！对比app.json文件发现原来问题出在这里，我在开启下拉刷新配置时是这样写的：
{
"enablePullDownRefresh": "true"
}
问题就在于上述代码中“true”是一个字符串类型，应该改成布尔值类型即true就可以得到解决。
{
"enablePullDownRefresh": true
}
