uniapp 截取两条数据 进行页面翻页滚动

// 轮播信息
<view class="sales_list" >
            <view class="sales_item" v-for="(item,index) in sellDisplayList" :key="index" @click="salesFn(item)">
              <image :src="item.goodsImg"></image>
              <u--text :text="item.name" bold ></u--text>
            </view>
          </view>

 data() {
    return {
      sellList:[],
      sellDisplayList:[],
      sellIndex: 0,
	}
 },
 created() {
 const params = {
        pageNum: 1,
        pageSize: 10,
      }
      //后端返回数据接口
    secondaryGoods(params).then(res=>{
      this.sellList = res.rows
      this.updatesecondaryGoods(); // 初始化显示数据
      setInterval(() => this.updatesecondaryGoods(), 			4000); // 每3秒钟更新显示数据
    })},
methods:{
	updatesecondaryGoods() {
      // 获取当前要显示的两条数据
      this.sellDisplayList = this.sellList.slice(
        this.sellIndex,
        this.sellIndex + 1
      );
      // 更新当前索引,循环滚动
      this.sellIndex = (this.sellIndex + 1) % this.sellList.length;
    },
}

相关推荐

  1. uniapp 截取数据 进行页面滚动

    2024-07-16 08:30:02       25 阅读
  2. 取消uniapp的scroll-view滚动

    2024-07-16 08:30:02       39 阅读
  3. uniapp如何监听滚动

    2024-07-16 08:30:02       50 阅读
  4. uniapp聊天页面之消息滚动

    2024-07-16 08:30:02       43 阅读

最近更新

  1. docker php8.1+nginx base 镜像 dockerfile 配置

    2024-07-16 08:30:02       70 阅读
  2. Could not load dynamic library ‘cudart64_100.dll‘

    2024-07-16 08:30:02       74 阅读
  3. 在Django里面运行非项目文件

    2024-07-16 08:30:02       62 阅读
  4. Python语言-面向对象

    2024-07-16 08:30:02       72 阅读

热门阅读

  1. 【Git 学习笔记】第六章 从仓库中提取有用信息

    2024-07-16 08:30:02       28 阅读
  2. Ant 风格的路径模式和 MVC 风格的路径模式 是什么

    2024-07-16 08:30:02       21 阅读
  3. electron-egg webSocket使用封装

    2024-07-16 08:30:02       19 阅读
  4. Spring的启动过程

    2024-07-16 08:30:02       23 阅读
  5. 并发编程-锁的分类

    2024-07-16 08:30:02       29 阅读
  6. Gmsh教程

    2024-07-16 08:30:02       31 阅读