微信小程序物流快递状态时间轴

最新推荐文章于 2024-06-27 14:14:56 发布

秃头女孩绝不认输

最新推荐文章于 2024-06-27 14:14:56 发布

阅读量892

点赞数 1

分类专栏：微信小程序文章标签： javascript css css3 html html5

本文链接：https://blog.csdn.net/jiahang_Li/article/details/111685210

版权

本文介绍了如何在微信小程序中创建一个展示物流快递状态的时间轴。通过结合wxml、wxss和js文件，实现了从单一物流信息到视觉效果的完整流程。参考了相关博文进行实现。

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

wxml:

<view class='g_con'>
  <view class='topExpress'>
    <image class="topExpress-left" src='/image/th.jpg' ></image>
    <view class='topExpress-right'>
      <view class='topExpress-right-top'>运输中</view>
      <view class='topExpress-right-middle'>承运来源：顺丰快递公司</view>
      <view class='topExpress-right-bottom'>运单编号：{
  {Number}} <text bindtap="onCopyNumber">复制</text> </view>
    </view>
  </view>
 
  <!-- 物流时间轴 -->
  <view class='expressRecord'>
    <!-- 单个物流记录点时间轴：当前正在进行的物流状态 -->
    <view class='expressRecord-single-close' wx:for="{
    {express}}<