uni-app开发小程序,利用scroll-view实现自动滚动至对应数据

uniapp scroll-view 官网

vue文件内容:
 
dom: 
  <scroll-view scroll-y :scroll-into-view="seqToView">
    <view class="pop-scroll">
      <view
        v-for="(item,index) in seqList"
        :id="'seq-' + item"
        :key="index"
        class="pop-seq"
        :class="seqIndex === index ? 'active' : ''"
        @click="selSeq(item,index)"
      >
        <text>{{ item }}</text>
      </view>
    </view>
  </scroll-view>
 
	滚动若太生硬,可加滚动过度效果属性 scroll-with-animation="true"
 
data: 
  seqToView: '' // 滚动至序号
 
js: 
  this.seqToView = 'seq-' + this.queNum // 滚动至选中序号位置

重点只是 圈住的

在这里插入图片描述
在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mfbz.cn/a/181832.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

ubuntu20.04安装多版本cuda,切换版本

1. 安装cuda toolkit: 下载网站 https://developer.nvidia.com/cuda-11.3.0-download-archive 选择版本&#xff0c;这里选择11.3 wget https://developer.download.nvidia.com/compute/cuda/11.3.0/local_installers/cuda_11.3.0_465.19.01_linux.run给cuda权限: chmod x…

数据结构与算法【红黑树】的Java实现+图解

前言 建议先阅读普通二叉搜索树与平衡二叉搜索树的文章。理解一些基本的二叉树知识数据结构与算法【二叉搜索树】Java实现-CSDN博客 介绍 红黑树也是一种自平衡的二叉搜索树&#xff0c;较之 AVL&#xff0c;插入和删除时旋转次数更少。 首先介绍代码实现会用到的概念 兄弟…

python-opencv在图片中绘制各种图形

python-opencv在图片中绘制各种图形 1.绘制直线 2.绘制矩形 3.绘制圆 4.绘制椭圆 5.绘制多边形 6.嵌入文字 实现代码都在下面了&#xff0c;代码中参数做了简单注释 import copy import math import matplotlib.pyplot as plt import matplotlib as mpl import numpy a…

OpenStack云计算平台-启动一个实例

目录 一、创建虚拟网络 ​二、创建m1.nano规格的主机 三、生成一个键值对 四、增加安全组规则 ​五、启动一个实例 1、确定实例选项 2、创建实例 3、使用虚拟控制台访问实例 4、验证能否远程访问实例 一、创建虚拟网络 下面的说明和框图使用示例IP 地址范围。你必须依…

单个视频生成视频二维码,手把手图文教程

单个视频生成视频二维码帮助教程&#xff08;图文教程&#xff09;&#xff0c;手把手教程如下&#xff1a; STEP1 注册帐号 使用视频二维码&#xff0c;您需要注册酷播云用户帐号&#xff08;免费5G空间&#xff0c;普通用户够用&#xff09;。 参考如图1-1&#xff0c;按照…

关于ElectronVue3中集成讯飞星火AI

前言&#xff1a;我的最终目的是为了在QQ上集成一个AI机器人&#xff0c;因此在这里先实现一个简单的集成 先上效果图 总体还是很简单的&#xff0c;我在调用websock获取回复内容的基础上另外集成了一个事件总线&#xff0c;让我们在调用获取消息的时候能够更加方便快捷 工具代…

前端学习--React(3)

一、Redux 集中状态管理工具&#xff0c;不需要react即可使用&#xff0c;每个store的数据都是独立于组件之外的 vue小链接&#xff1a;vuex/pinia 基本使用 Redux将数据修改流程分成三个概念&#xff0c;state、action和reducer state - 一个对象 存放我们管理的数据状态 a…

OpenStack云计算平台-镜像服务

目录 一、镜像服务概览 二、安装和配置 1、先决条件 2、安全并配置组件 3、完成安装 三、验证操作 一、镜像服务概览 OpenStack镜像服务是IaaS的核心服务&#xff0c;如同 :ref:get_started_conceptual_architecture所示。它接受磁盘镜像或服务器镜像API请求&#xff0c;…

2023服务端测试开发必备技能:Mock测试

什么是mock测试 Mock 测试就是在测试活动中&#xff0c;对于某些不容易构造或者不容易获取的数据/场景&#xff0c;用一个Mock对象来创建以便测试的测试方法。 Mock测试常见场景 无法控制第三方系统接口的返回&#xff0c;返回的数据不满足要求依赖的接口还未开发完成&#…

浅谈电气设备的绝缘在线监测与状态维修探究

贾丽丽 安科瑞电气股份有限公司 上海嘉定 201801 摘要&#xff1a;在线监测是控制好电气设备绝缘的重要方式&#xff0c;为电力系统稳定奠定重要基础。在线监测电气设备时&#xff0c;要利用检测技术促进电力系统运行效率提升&#xff0c;让电气设备在具体工作过程中发挥更大作…

YAML 深入解析:从语法到最佳实践

什么是YAML YAML&#xff08;YAML Ain’t Markup Language&#xff09;是一种人类可读的数据序列化语言。它的设计目标是使数据在不同编程语言之间交换和共享变得简单。YAML采用了一种简洁、直观的语法&#xff0c;以易于阅读和编写的方式表示数据结构。 YAML广泛应用于配置文…

外部 prometheus监控k8s集群资源(pod、CPU、service、namespace、deployment等)

prometheus监控k8s集群资源 一&#xff0c;通过CADvisior 监控pod的资源状态1.1 授权外边用户可以访问prometheus接口。1.2 获取token保存1.3 配置prometheus.yml 启动并查看状态1.4 Grafana 导入仪表盘 二&#xff0c;通过kube-state-metrics 监控k8s资源状态2.1 部署 kube-st…

php生成xml数据

在PHP中&#xff0c;你可以使用以下几种方法生成XML数据&#xff1a; 使用DOM扩展&#xff1a; $xml new DOMDocument(1.0, UTF-8); $root $xml->createElement(root); $xml->appendChild($root); $child $xml->createElement(child); $root->appendChild($ch…

鸿蒙原生应用/元服务开发-AGC分发如何配置签名信息

使用制作的私钥&#xff08;.p12&#xff09;文件、在AGC申请的证书文件和Profile&#xff08;.p7b&#xff09;文件&#xff0c;在DevEco Studio配置工程的签名信息&#xff0c;以构建携带发布签名信息的APP。 1.打开DevEco Studio&#xff0c;菜单选择“File > Project S…

IP定位揭秘:如何揪出SEM、百度竞价恶意点击

在当今的数字营销领域&#xff0c;搜索引擎营销&#xff08;SEM&#xff09;和百度竞价成为了企业推广的重要手段。然而&#xff0c;随着这些渠道的普及&#xff0c;恶意点击现象也日益严重。恶意点击主要来自竞争对手&#xff0c;或是竞价服务的提供商&#xff0c;他们通过点击…

听GPT 讲Rust源代码--src/tools(2)

题图来自AI生成 File: rust/src/tools/rust-analyzer/crates/hir-def/src/src.rs rust-analyzer 是一个 Rust 语言的语法分析器和语义分析器&#xff0c;用于提供代码补全、导航、重构等开发工具。而 rust-analyzer 的代码实现存储在 rust/src/tools/rust-analyzer 这个文件夹中…

【数据结构】一题带你出师链表!

&#x1f984;个人主页:修修修也 &#x1f38f;所属专栏:数据结构 ⚙️操作环境:Visual Studio 2022 题目链接 138. 随机链表的复制https://leetcode.cn/problems/copy-list-with-random-pointer/ 题目描述 给你一个长度为 n 的链表&#xff0c;每个节点包含一个额外增加的随机…

(保姆级教程)Mysql中索引、触发器、存储过程、存储函数的概念、作用,以及如何使用索引、存储过程,代码操作演示

讲解 MySQL 中索引、触发器、存储过程、存储函数的使用 文章目录 1. 索引1.1 索引的分类1.2 索引的设计原则1.3 如何使用&#xff08;create index&#xff09; 2. 触发器2.1 触发器的分类2.2 如何使用&#xff08;create trigger&#xff09; 3. 存储过程3.1 如何使用&#xf…

【尚跑】2023泾阳半程马拉松144 PB完赛

1、赛事背景 来到泾阳&#xff0c;就来到了中国大地原点&#xff1b; 来到泾阳&#xff0c;就来到了陕西的“白菜心心”&#xff1b; 来到泾阳&#xff0c;就来到了具有2000多年的历史长河&#xff1b; 泾河水缓缓流&#xff0c;流过郑国渠&#xff1b; 泾河水缓缓流&…
最新文章