制作滚动条除了scroll-view,还可以使用swiper，其中，默认为横向滚动，若要设置为纵向滚动则为vertical='{{ true }}'
以下为开发中的一个案例：
wxml部分
<view class="elegant">
    <swiper style="height:80rpx;" autoplay='{{ true }}' circular='{{ true }}' interval='5000' vertical='{{ true }}'>
      <block wx:for="{{textlist}}" wx:key="">
        <swiper-item class="tattoo" >
          <view >
            <text>{{item.name}}</text>
          <text>{{item.seller}}</text>
          <text>{{item.title}}</text>
          </view>
        </swiper-item>
      </block>
    </swiper>
</view>
 
wxss部分为：
/* 滚动内容 */
.elegant{
    ">#ffe8e3;
    width:650rpx;
    height:80rpx;
    margin: 0 auto;
  }
swipper{
  width:100%;
}
.tattoo text{
  font-size:24rpx;
  color:#9a823b;
  padding-left:5rpx;
  align-items: center;
  line-height: 80rpx;
}
 
js部分为：
textlist:[
      {
id:0,
        name:'1414的小公举刚刚下单了 ',
        seller:'麻辣小龙虾一份',
        title:'请尽快抢单哟~~'
      },
      {
        id:1,
        name: '1414的小公举刚刚下单了 ',
        seller: '水煮鱼一份',
        title: '请尽快抢单哟~~'
      },
      {
        id:2,
        name: '1414的小公举刚刚下单了 ',
        seller: '大龙虾一份',
        title: '请尽快抢单哟~~'
      },
      ]
 
方法2
 
<scroll-view scroll-x='true' class="notice">
    <view class='scrolltxt'>
      <view class='marquree_box'>
        <view class="marquee_text" style="transform: translateX(-{{marqueeDistance}}px)">
          <text>{{text}}</text>
          <text style="margin-right:{{marquree_marign}}px;">{{text}}</text>
          <text style="margin-right:{{marquree_marign}}px;">{{text}}</text>
        </view>
      </view>
    </view>
  </scroll-view>
.notice { */
  /* */
margin-left: 90rpx;
  display: flex;
  width: 660rpx;
  align-items: center;
}
.scrolltxt {
  height: 60rpx;
}
.marquree_box {
  font-size: 26rpx;
  height: 60rpx;
  display: flex;
  align-items: center;
  color: #b09961;
}
.marquee_text {
  overflow: hidden;
  white-space: nowrap;
  height: 60rpx;
  line-height: 60rpx;
}
 
text: "当前订单买家打赏“6元”，送到“国际0中心2号楼14楼14号”",
    marqueePace: 0.5,
    // 滚动速度
    marqueeDistance: 0,
    // 初始滚动距离
    marquee_margin: 30,
    size: 14,
    // 尺寸大小
    interval: 20,
    // 时间间隔
 
 
  notic() {
    // 页面显示
    var that = this;
    var length = that.data.text.length * that.data.size; //文字长度
    var windowWidth = wx.getSystemInfoSync().windowWidth; // 屏幕宽度
    //console.log(length,windowWidth);
    that.setData({
      length: length,
      windowWidth: windowWidth
    });
    that.scrolltxt(); // 第一个字消失后立即从右边出现
  },
  scrolltxt: function() {
    var that = this;
    var length = that.data.length; //滚动文字的宽度
    var windowWidth = that.data.windowWidth; //屏幕宽度
    if (length > windowWidth) {
      var interval = setInterval(function() {
        var maxscrollwidth = length + that.data.marquee_margin; //滚动的最大宽度，文字宽度+间距，如果需要一行文字滚完后再显示第二行可以修改marquee_margin值等于windowWidth即可
        var crentleft = that.data.marqueeDistance;
        if (crentleft < maxscrollwidth) { //判断是否滚动到最大宽度
          that.setData({
            marqueeDistance: crentleft + that.data.marqueePace
          })
        } else {
          //console.log("替换");
          that.setData({
            marqueeDistance: 0 // 直接重新滚动
          });
          clearInterval(interval);
          that.scrolltxt();
        }
      }, that.data.interval);
    } else {
      that.setData({
        marquee_margin: "1000"
      }); //只显示一条不滚动右边间距加大，防止重复显示
    }
  },