微信小程序之列表渲染后跳转详情页面(页面跳转带参数 和 js获取参数)

1.列表页面样式:

<view class="table">
    <block wx:for="{{staffList}}" wx:key="{{index}}">
      <view class="tr" bindtap="onStaffDetail" data-index='{{index}}'>
        <view class="td_1">
          <view class='one_div'>
            <view class='tx_1'>{{item.staffName}}</view>
            <block wx:if="{{item.sex=='MAN'}}">
              <view class="tx_2">男</view>
            </block>
            <block wx:elif="{{item.sex=='WOMAN'}}">
              <view class="tx_2">女</view>
            </block>
            <block wx:else>
              <view class="tx_2">未知</view>
            </block>
            <view class='tx_3'>{{item.roleName}}</view>
          </view>

          <view class='two_div'>
            <view class='tx_4'>{{item.orgName}}</view>
            <block wx:if="{{item.enable==true}}">
              <view class="tx_5">在职</view>
            </block>
            <block wx:elif="{{item.enable==false}}">
              <view class="tx_5">离职</view>
            </block>
          </view>
        </view>
      </view>
    </block>
  </view>

2.列表js跳转详情页面函数:

 onStaffDetail:function(e){
    var index = parseInt(e.currentTarget.dataset.index);
    var staffId=this.data.staffList[index].staffId;
    wx.navigateTo({
      url: '/pages/staffdetail/index?staffId=' + this.data.staffList[index].staffId,
    })
  },

3.详情页面获取所传参数js:

onLoad: function(options) {
    var that = this;
    this.setData({
      staffId: options.staffId
    })  
    var staffId=this.data.staffId;
    http.get('/staffDetail', {
      staffId: staffId
    }, function(err, res) {
      if (res.success == false) {
        wx.redirectTo({
          url: '/pages/login/index',
        })
      }
      if (res.errCode == 0) {
        that.setData({
          staffDetail: res.data
        })
      }
    });



  },

 

  • 3
    点赞
  • 19
    收藏
    觉得还不错? 一键收藏
  • 5
    评论
评论 5
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值