程序员经验分享-hwhale

vue实现动态锚点

2023-10-29 
 <div v-for="(item,index) in dialogList" :key="index" class="dialog-header-item" 	@click="getActiveClass(index)">
 	{{item}}
</div>

需要点击的目标增加click事件，并且把索引传下去，没有索引也没有关系，想传什么传什么

// 锚点
getActiveClass(index) {
	let jump = document.querySelectorAll(".condition-container");
	jump[index].scrollIntoView({ block: "start", behavior: "smooth" });
},

condition-container：滚动到目标位置的class

本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)

vue

vue实现动态锚点 的相关文章

  • #define用法总结

    刚开始接触VC 的同学们 估计对这个东西有这莫大的恐惧 这个经常写在添加头文件的地方的奇怪语句 如果看过mfc那么 那么拿出一些application framework里面的宏 估计会吓死一片 说了这么多只是想说 不明白其用法的人很害怕

随机推荐

  • 经典法谱估计（1）周期图法MATLAB及Python实现

    原理 对于一个无限长序列x n 其傅里叶变换DTFT 也可称作离散时间傅里叶变换 及其反变换的定义式为 但是在我们的分析处理过程中 只能分析处理离散化的信号 也即N点取样 对于一个长度为N的有限长序列x n 其离散傅里叶变换及其反变换的定义

  • osgEarth的Rex引擎原理分析（一二一）osgEarth::TileRasterizer功能详解

    目标 五十二 中的问题123 本质是一个相机 用于将下面的节点渲染到纹理中 src osgEarth TileRasterizer class OSGEARTH EXPORT TileRasterizer public osg Camera

  • 神经网络面试题-1

    文章目录 1 批规范化 Batch Normalization 的好处都有啥 2 如果我们用了一个过大的学习速率会发生什么 3 下图所示的网络用于训练识别字符H和T 如下所示 4 增加卷积核的大小对于改进卷积神经网络的效果是必要的吗 5 假

  • maven跳过单元测试-maven.test.skip和skipTests的区别

    原文链接 http blog csdn net arkblue article details 50974957 DskipTests 不执行测试用例 但编译测试用例类生成相应的class文件至target test classes下 Dm

  • 【Linux C小技巧】零长度数组的使用

    本期主题 讲清Linux C的零长度数组使用 内容包括 零长度数组是什么原理 为什么要使用零长度数组 与指针的差异 往期链接 数据结构系列 先进先出队列queue 数据结构系列 栈 stack Linux内核链表 目录 0 前言 1 零长度

  • git上传代码到github

    来源 我是码农 转载请保留出处和链接 本文链接 http www 54manong com id 1219 一 首先在windows上安装msysgit 1 msysgit下载地址如下 链接 https pan baidu com s 1T

  • 小米红米手机刷入Recovery手机教程-TWRP下载-获取root权限-新增小米12/13Pro适配

    刷机注意 本教程为小米全机型 目前已整理机型都可以使用 请确保你的电脑能正确连接你的手机 部分手机需要解锁BL 小米解锁BL教程 http www romleyuan com lec read id 83 更新日志 20230221更新日志

  • 【atoi函数的介绍以及模拟实现】

    目录 前言 一 atoi函数测试 1 要求 2 测试 二 atoi函数模拟实现 三 补充 前言 位置 atoi函数包含在

  • 天地图服务与开发

    天地图服务与开发 天地图在线地图网址 2021年7月2日 国家地理信息公共服务平台天地图2021版正式启用 传统版地址 https map tianditu gov cn 2020 新版地址 https map tianditu gov c

  • ssh telnet linux中显示中文

    vi etc sysconfig i18n 将内容改为 LANG zh CN GB18030 LANGUAGE zh CN GB18030 zh CN GB2312 zh CN SUPPORTED zh CN GB18030 zh CN z

  • office中excel设置下拉框多选

    我参照了这篇文章 https www php cn topic excel 444717 html 这篇文章整体写得不错 但是有些小瑕疵 问题1 在模块1中保存 这里并没有说清楚 具体是 VBA编辑器中 插入 模块 然后复制以下代码 Pub

  • js if else return不管用_前端知识013 学会异步，JS不再烧脑

    01 同步和异步 0101 认识同步异步 0102 前端经常遇到的异步操作 三个经典例子 0103 拿到异步的结果 轮询和回调 0104 回调的几种方式 02 Promise 0201 Promise基本用法 0202 Promise 基本

  • 【打卡-蓝桥杯】Day 7

    题目1 基础练习 芯片测试 解题思路 因为好的芯片多于坏的 所以如果是好芯片 那个被测试为 1 的 总数 gt n 2 代码 n int input arr list map int input split for in range n f

  • python自动化控制设备有限公司_华为 Python网络自动化

    哈喽 大家好 我是艺博东 是一个思科出身 专注于华为的网工 好了 话不多说 我们直接进入正题 光棍二十年 不知道情人节是什么鬼东西 还是好好学技术吧 努力 奋斗吧 为了早日走向人生巅峰 迎娶白富美 拼了 1 安装环境并导入相关模块 首先是安

  • 错误 0xc0202009: 数据流任务 1: SSIS 错误代码 DTS_E_OLEDBERROR。出现 OLE DB 错误。

    原来是一个varchar字段出出现了 和 等特殊字符 这个在insert语句中没有问题 但是使用导入导出会报错 最后要注意的是 导入导出使用的是BulkInsert 方式 每次可能读取一大段 多行记录一起处理 如果这批数据中有错 那么 程序

  • html5注册阿里巴巴作业,面试分享：2018阿里巴巴前端面试总结(题目+答案)

    该楼层疑似违规已被系统折叠 隐藏此楼查看此楼 使用js实现一个持续的动画效果 最开始的思路是用定时器实现 最后没有想的太完整 面试官给出的答案是用 requestAnimationFrame var e document getElemen

  • Java基础（四）——多态、抽象类、接口、内部类

    一 多态 1 多态性是指同一操作作用于某一类对象 可以有不同的解释 产生不同的执行效果 同一事件发生在不同的对象身上 有不同的效果 2 多态存在的三个必要条件 a 需要存在继承和实现关系 b 同样的方法调用而执行不同操作 运行不同代码 重写

  • JS 中把对象按属性名字母顺序进行排序和倒序

    本文同步发布在 JS 中把对象按属性名字母顺序进行排序和倒序 我们在进行前端开发的时候 有时需要对参数进行签名 签名很多第一步是把对象按属性名字母顺序进行排序 那么在 JS 中如何实现呢 实现方式很多 这边介绍一种通过 ES6 的方式来实现

  • Andy‘s First Dictionary C++ STL set应用

    目录 题目描述 思路分析 代码 题目描述 原文 Andy 8 has a dream he wants to produce his very own dictionary This is not an easy task for him

  • vue实现动态锚点

    div class dialog header item item div 需要点击的目标增加click事件 并且把索引传下去 没有索引也没有关系 想传什么传什么 锚点 getActiveClass index let jump docum

热门标签