微信小程序-订单页面——可左右滑动（附源码）

最新推荐文章于 2022-10-23 10:49:49 发布

刺心疯

最新推荐文章于 2022-10-23 10:49:49 发布

阅读量5.5k

点赞数 2

分类专栏：微信小程序

本文链接：https://blog.csdn.net/qq_42363090/article/details/94430659

版权

微信小程序专栏收录该内容

121 篇文章 12 订阅 ¥69.90 ¥99.00

订阅专栏

超级会员免费看

这篇博客介绍了如何在微信小程序中创建一个订单页面，该页面包含三种预约状态的切换功能，允许用户左右滑动进行查看。文章提供了WXML结构、WXSS样式以及JS逻辑代码，用于初始化数据和控制默认显示的内容。

摘要由CSDN通过智能技术生成

说明：头部有一个三种预约状态的切换
在这里插入图片描述

wxml页面：

<!-- 切换栏 -->
<view class="swiper-tab">
  <block wx:for="{
  {swipertab}}" wx:key="sptab">
    <view class="swiper-tab-list {
  {currtab == item.index ? 'on' : ''}}" data-current="{
  {item.index}}" bindtap="tabSwitch">{
  {item.name}}</view>
  </block>
</view>
 
<swiper current="{
  {currtab}}" class="swiper-box" duration="300" style="height:{
  {deviceH-31}}px" bindchange="tabChange">