微信小程序第二天（列表功能获取传值）

列表取值

任何一个APP，WEB都不会缺少列表的动态生成。所以微信小程序也不列外，官网上有微信动态生成的代码。但仅仅动态生成还不足以开发项目。下面我来告诉大家如何获取单击的列表的值，并且传入下一个界面。
生成动态列表的代码：

<block wx:for="{{[1, 2, 3]}}">
  <view> {{index}}: </view>
  <view> {{item}} </view>
</block>

动态取得列表的值可以自定义一个属性 data-itemnum={{item}},将属性添加到标签里面即可，代码如下：

  <view data-itemnum={{item}} > {{item}} </view>

再给这个视图绑定一个单机方法，代码如下：

 <view data-itemnum="{{item}}" bindtap="itemClick"> {{item}} </view>

再单击方法itemClick中获取列表中的值，代码如下：

itemClick:function(e){
     console.log('单击',e.currentTarget.dataset.itemnum);
}

上面打印出来的就是你需要的值data-itemnum这种可以定义很多个。但要保持data-**这种格式.

这种用列表的ID来获取详情数据用的特别多。在一个就是把列表中获取的数据出入到下一个界面。通常是详情页，方法有很多。如存入缓存，拼在URL后面，这次讲解的是URL后面拼值与取值。

列表传值

还是用上面的方法itemClick，只不过要加上微信封装的打开页面方法。代码如下：

itemClick:function(e){
     console.log('单击',e.currentTarget.dataset.itemnum);
     var name=e.currentTarget.dataset.itemnum
     wx.navigateTo({
    url: 'name/name?name='+name//这是我建立的另一个界面，你们别忘了在app.json里面加路径哦
  });
}

name界面获取上个界面传值的代码如下：

onLoad:function(options){//onLoad是页面加载事件已进入就会自动加载一次
      console.log(options.name);
  }

欢迎大家关注我的公众号吵吵日记：