小程序中for循环列表后点击不同列表跳转不同页面

奥利给,加油加油,加油
最近没那么多事了,但是学习绝对不能拉下,加油 代码: wxml:
<view class="lingshi">零食天地</view>
<view class="lingshi-all" >
  <view class="lingshi-kuang" wx:for="{{lingshi}}" bindtap='changBtn'  data-id="{{item.id}}">
   <image src="{{item.src}}"></image>
   <span>{{item.name}}</span>
   <view class="lingshi-3kuai">
    <p>{{item.jiage}}</p>
    <p>{{item.jiage1}}</p>
    <p>{{item.xiadan}}</p>
   </view>
  </view>
</view>

在这里插入图片描述
js:

 lingshi:[
      {id:'01',src:'/image/燕麦.jpg',name:"燕麦半斤",jiage:"¥5.0",jiage1:"¥8.0",xiadan:"下单"},
      {id:'02',src:'/image/果冻.jpg',name:"果冻",jiage:"¥3.6",jiage1:"¥5.0",xiadan:"下单"},
      {id:'03',src:'/image/江米条.jpg',name:"江米条",jiage:"¥5.0",jiage1:"¥8.0",xiadan:"下单"},
      {id:'04',src:'/image/迷你卷.jpg',name:"迷你卷",jiage:"¥5.0",jiage1:"¥8.0",xiadan:"下单"},
      {id:'05',src:'/image/豆干.jpg',name:"豆干",jiage:"¥5.0",jiage1:"¥8.0",xiadan:"下单"},
      {id:'06',src:'/image/麻花.jpg',name:"麻花",jiage:"¥5.0",jiage1:"¥8.0",xiadan:"下单"},
      {id:'07',src:'/image/鸡腿.jpg',name:"鸡腿",jiage:"¥5.0",jiage1:"¥8.0",xiadan:"下单"},
      {id:'08',src:'/image/香肠.jpg',name:"香肠",jiage:"¥5.0",jiage1:"¥8.0",xiadan:"下单"},
    ]

在这里插入图片描述

changBtn:function(e){
    var $id = e.currentTarget.dataset.id;
    console.log($id)
    if ("01"== $id){
      wx.navigateTo({
        url: '/pages/lingshi/lingshi',
      })
    }
    if ("02" == $id) {
      wx.navigateTo({
        url: '/pages/lingshi/lingshi',
      })
    }
  },

在这里插入图片描述

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

乘风破浪PL

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值