微信小程序左侧导航栏与右侧内容区商品联动并实现导航栏高亮

最新推荐文章于 2024-05-09 16:29:33 发布

lone wolf 1

最新推荐文章于 2024-05-09 16:29:33 发布

阅读量972

点赞数

文章标签：经验分享 Powered by 金山文档

本文链接：https://blog.csdn.net/m0_64534855/article/details/129366170

版权

点击不同的导航栏获取不同的商品数据并在内容区渲染出来，导航栏点击后实现高亮，商品数据我用的静态数据用来做一个模拟数据，也可以使用请求api获取数据，代码如下

index.wxml

<view class="left_nav">
  <ul wx:for="{
   {nav_list}}"> 
    <li bindtap="nav_list" data-id="{
   {item.id}}" class="menu-item {
   {index===activeIndex?'active':''}}" data-index="{
   {index}}"><view style="margin-top:40rpx;">{
   {item.text}}</view></li>
  </ul>
</view>