因为在vue中,某个组件内 使用scrollTop赋值 滚动条没有变化

使用scrollTo 也不行(window.scorllTo 或者dom.scrollTo)

所以可以考虑使用投机取巧的办法:

利用在指定位置添加一个div 然后通过div.scrollIntoView() 滚动到这个div

<div class="position-box"></div>

// 跳转到positionbox
document.getElementsByClassName('position-box')[0].scrollIntoView();

Vue 组件内滚动条 滚到到底部的更多相关文章

  1. vue之Better-Scroll组件 将滚动条滚到最底部

    首先我们需要使用scrollTo这个方法: scrollTo(x, y, time, easing) 参数: {Number} x 横轴坐标(单位 px) {Number} y 纵轴坐标(单位 px) ...

  2. vue 组件内 directives指令的调用方式 <base-table v-auto-height:tableHeight="{vm:this, diffHeight:ahTable.diffHeight}"

    vue 组件内 directives指令的调用方式 <base-table v-auto-height:tableHeight="{vm:this, diffHeight:ahTabl ...

  3. vue-gemini-scrollbar(vue组件-自定义滚动条)

    vue-gemini-scrollbar(vue组件-自定义滚动条) https://segmentfault.com/a/1190000013338560

  4. 解决vue组件内前置路由守卫beforeRouteEnter无法获取上下文this

    问题描述 vue框架,只有在报名页面报名成功,然后自动跳转到订单详情,才弹出一个引流弹窗,其他情况均不弹出,我就想到使用vue 的组件内前置守卫beforeRouteEnter来实现.beforeRo ...

  5. canvas实现倒计时效果示例(vue组件内编写)

    前言: 此事例是在vue组件中,使用canvas实现倒计时动画的效果.其实,实现效果的逻辑跟vue没有关系,只要读懂canvas如何实现效果的这部分逻辑就可以了 canvas动画的原理:利用定时器,给 ...

  6. vue 组件内的守卫

    1.beforeRouteEnter ()  // 进入该组件之前要去进行的逻辑操作, 2.beforeRouteLeave() // 离开该组件之前要去进行的逻辑操作(可清除定时器等耗用内存的变量, ...

  7. jquery如何判断滚动条滚到页面底部并执行事件

    首先理解三个dom元素,分别是:clientHeight.offsetHeight.scrollTop. clientHeight:这个元素的高度,占用整个空间的高度,所以,如果一个div有滚动条,那 ...

  8. JS实现判断滚动条滚到页面底部并执行事件的方法

    需要了解三个dom元素,分别是:clientHeight.offsetHeight.scrollTop. clientHeight:这个元素的高度,占用整个空间的高度,所以,如果一个div有滚动条,那 ...

  9. vue 内容增加滚动条自动定位至底部

    this.$nextTick(() => { document.body.scrollTop = document.body.scrollHeight; console.log(document ...

随机推荐

  1. 差分约束系统——POJ1275

    之前做过差分,但是没做过差分约束系统. 正好在学军机房听课讲到这道题,就顺带学了一下. 其实...就是列不等式组然后建图 作为蒟蒻,当然是不会加二分优化的啦...但是poj上还是94ms跑过了qwq ...

  2. JDK11 下载安装与配置环境变量

    1.jdk11本身也包含jre,不需要安装jre,低版本需要安装jre 2.jdk下载地址:https://www.oracle.com/technetwork/java/javase/downloa ...

  3. 开始学习Django,配置静态登录页面

    开始学习Django,配置静态登录页面 准备阶段 众所周知,Django是一个重量级的设备齐全的web开发框架.在学习Django前我们需要具备如下的知识点: python基础编程 并发 网络编程 H ...

  4. docker 连接MySQL&#183;集群

    1 指定端口 docker run -p 3307:3306 --name root -e MYSQL_ROOT_PASSWORD=root -d mysql # 6380 root password ...

  5. C++将整型值转换为字符串

    最简单的方法是使用一个字符串流(stringstream):#include<iostream>#include<string>#include<sstream>u ...

  6. jvm基本结构和解析

    jvm的基本结构图如下 这只是代表我的个人理解  不是很深刻  欢迎各类大神进行补充和纠正 jvm之所以强大就是因为他从软件层面屏蔽不用操作系统在底层硬件与指令上的区别,从而可以在不同系统上兼容 主要 ...

  7. 双向数据绑定 v-model

    双向数据绑定 就是既可以从页面传到数据也可以从数据到页面 初始运行结果为: 在输入框 更改数据 相应的输入框上的也会相对改变 然后再试试利用控制台更改数据 可以看到数据也被改变了 而且输入框中的内容也 ...

  8. [水题日常]Luogu1462 通往奥格瑞玛的道路

    QwQ马上高二啦不能颓啦-知乎上听说写博客的效果挺好的,来试一下好啦~ 题目链接<< 题目描述 在艾泽拉斯,有n个城市.编号为1,2,3,...,n. 城市之间有m条双向的公路,连接着两个 ...

  9. javascript笔记day01

    JavaScript基础语法 HTML :标记语言 JavaScript :编程语言 序言 JavaScript发展历史(JS) 1. 1994年,网景公司(Netscape)发布了Navigator ...

  10. 【mybatis-plus】CRUD必备良药,mybatis的好搭档

    做开发,免不了对数据进行增删改查,那么mybatis-plus我觉得很适合我这个java新手,简单好用. 官网在这 一.什么是mybatis-plus MyBatis-Plus(简称 MP),是一个M ...