微信小程序模仿新闻栏目可横向拖动的菜单tabbar如何写代码?
网友回复
效果
wxml
<view > <scroll-view scroll-x="true" class="tab-h" scroll-left="{{scrollLeft}}"> <view class="tab-item {{currentTab==0?'active':''}}" data-current="0" bindtap="swichNav">健康</view> <view class="tab-item {{currentTab==1?'active':''}}" data-current="1" bindtap="swichNav">情感</view> <view class="tab-item {{currentTab==2?'active':''}}" data-current="2" bindtap="swichNav">职场</view> <view class="tab-item {{currentTab==3?'active':''}}" data-current="3" bindtap="swichNav">育儿</view> <view class="tab-item {{currentTab==4?'active':''}}" data-current="4" bindtap="swichNav">纠纷</view> <view class="tab-item {{currentTab==5?'active':''}}" data-current="5" bindtap="swichNav">青葱</view> <view class="tab-item {{currentTab==6?'active':''}}" data-current="6" bindtap="swichNav">全部</view> <view class="tab-item {{currentTab==7?'active':''}}" data-current="7" bindtap="swichNav">其他</view> </scroll-view> <swiper class="tab-content" current="{{currentTab}}" duration="300" bindchange="switchTab" style="height:{{winHeight}}rpx"> <swiper-item wx:for="{{[0,1,2,3,4,5,6,7]}}"> <scroll-view scroll-y="true" class="scoll-h" > <block wx:for="{{[1,2,3,4,5,6,7,8]}}" wx:key="*this"> <view class="item-ans"> <view class="avatar"> <image class="img" src="http://ookzqad11.bkt.clouddn.com/avatar.png"></image> </view> <view class="expertInfo"> <view class="name">欢颜</view> <view class="tag">知名情感博主</view> <view class="answerHistory">134个回答,2234人听过 </view> </view> <navigator ...
点击查看剩余70%
如何编写一个chrome插件实现多线程高速下载大文件?
cdn版本的vue在网页中出现typeerror错误无法找到错误代码位置怎么办?
pywebview能否使用webrtc远程控制共享桌面和摄像头?
pywebview6.0如何让窗体接受拖拽文件获取真实的文件路径?
如何在linux系统中同时能安装运行apk的安卓应用?
python有没有离线验证码识别ocr库?
各家的ai图生视频及文生视频的api价格谁最便宜?
openai、gemini、qwen3-vl、Doubao-Seed-1.6在ui截图视觉定位这款哪家更强更准?
如何在linux上创建一个沙箱隔离的目录让python使用?
pywebview如何使用浏览器自带语音识别与webspeech 的api?