例:点击新闻列表中的某条新闻,跳转至对应的新闻详情页面
1.在新闻列表页面,选定一个参数(具有唯一性的参数),传至下一页面,即详情页面。绑定一个点击事件toNewsDetail,把要传的参数以“data-”的格式进行传递,此处传的参数为title;
代码如下:
<block wx:for="{{ArrNews}}" wx:for-item="item" >
<view bindtap='toNewsDetail' data-title="{{item.Title}}">
<view>标题:{{item.Title}}</view>
</view>
</block>
2.在新闻列表页面,用“e.currentTarget.dataset.xx”获取要传入详情页面的参数title,并在navigateTo中传入参数进行跳转;
代码如下:
toNewsDetail:function(e){
var Title = e.currentTarget.dataset.title;
wx.navigateTo({
url: '../NewsDetail/NewsDetail?Title=' + Title,
})
}
3.在详情页面接收数据,数据存在options中,以 “options.参数名”的形式进行获取,此处示例是利用富文本插件WxParse来解析通过接口读取的服务器中HTML格式的新闻内容并进行显示的;
代码如下:
data: {
dictNews: {},
Title: "",
},
onLoad: function(options) {
var that = this;
var Title = options.Title;
var arrContent = wx.getStorageSync('content'); //获得上一页面的缓存数据
for (var i = 0; i < arrContent.length; i++) {//遍历获取到的新闻列表
var tempResult = arrContent[i];
if (Title == tempResult.Title) {//当遍历到的新闻标题与当前所传的title参数相同时
that.setData({
dictNews: tempResult//将此条新闻内容赋给字典dictNews
})
WxParse.wxParse('content', 'html', that.data.dictNews.Content, that, 5);//解析该新闻内容
break;
}
}
/**
* WxParse.wxParse(bindName , type, data, target,imagePadding)
* 1.bindName绑定的数据名(必填)
* 2.type可以为html或者md(必填)
* 3.data为传入的具体数据(必填)
* 4.target为Page对象,一般为this(必填)
* 5.imagePadding为当图片自适应是左右的单一padding(默认为0,可选)
*/