微信小程序item怎么页面传参

微信小程序item页面传参的案例：

A页面

data-id="{{item.id}}"为标记列表的下标，

item.id的来源与wx:for="{{ components }}"的列表渲染

bindtap="readArticle"点击事件

在for循环的时候会报异常，加wx:key=""异常就不会出现了

wxml文件代码

<viewclass="grids-small">
<blockwx:for="{{components}}"wx:key="">
<viewclass="grid"bindtap="readArticle"data-id="{{item.id}}">
<viewclass="grid_icon">
<imageclass="grid_icon"src="../resources/room.jpg"alt=""/>
</view>
<viewclass="grid_label">{{item.title}}</view>
</view>
</block>
</view>

js文件代码

readArticle:function(e){
var$data=e.currentTarget.dataset;
console.log('$data===啊哈哈'+$data.id);
wx.navigateTo({
url:'/pages/index/index?id='+$data.id,
})
}

B页面代码

/**
*生命周期函数--监听页面加载
*/
onLoad:function(options){
var$data=options.id;
console.log('onLoad'+$data)
console.log('options======'+$data);
},