微信小程序点击列表跳转到详情页面实现

最新推荐文章于 2024-07-25 16:38:27 发布

xcjlk

最新推荐文章于 2024-07-25 16:38:27 发布

阅读量7.7k

点赞数 6

本文链接：https://blog.youkuaiyun.com/xcjlk/article/details/105180235

版权

实现效果：
在这里插入图片描述
点击页面

（1）用自定义属性data-index保存当前点击列表的index，在点击跳转的方法中获取index并且拼接到要跳转的路径后面：

readcd:(e)=> {
    let index=e.currentTarget.dataset.index;
    wx.navigateTo({
      url: '../cd_read/cd_read?index='+index,
    })
  },

(2) 跳转到详情页，在onLoad中通过参数options获取传过来的index，渲染对应的数据

/**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    console.log(options)
    var that = this
    let index = options.index;

    //当页面加载时请求数据
    wx.request({
      url: '******************************',
      method: "POST",
      header: {
        'content-type': 'application/x-www-form-urlencoded',
      },