scrollToBottom: function () {
    this.$nextTick(() => {
        var container = this.$el.querySelector("#new_message");
        container.scrollTop = container.scrollHeight;
    });
}

调用此方法即可

vue 中滚动div至最底部的更多相关文章

  1. vue中滚动页面，改变样式&&导航栏滚动时，样式透明度修改

    vue中滚动页面,改变样式&&导航栏滚动时,样式透明度修改.vue <div class="commonHeader" v-bind:class=" ...

  2. vue中滚动事件绑定的函数无法调用问题

    问题描述: 一个包含下拉加载的页面,刷新当前页然后滚动页面,能够正常触发滚动事件并调用回调函数,但是如果是进了某一个页面然后再进的该页面,滚动事件能够触发, 但是回调函数在滚动的时候只能被调用一次. ...

  3. 【vue】vue中ref用法

    1.获取当前元素: 例子: <div class="pop pos-a" :style="{ left: pop_x + 'px' ,top: pop_y + 'p ...

  4. vue中添加echarts

    方法一:全局引入echarts 步骤: 1.全局安装 echarts依赖.        cnpm install echarts -- save 2.引入echarts模块,在Vue项目的main. ...

  5. vue中插槽作用域的使用

    一.插槽作用域 1.简单来说就是带参数的插槽: 2.使用方式: 在组件标签内部加一个template标签 在template标签上加一个属性scope 值随意书写 在组件内部用slot进行接受,如果给 ...

  6. vue中使用echarts的两种方法

    在vue中使用echarts有两种方法一.第一种方法1.通过npm获取echarts npm install echarts --save 2.在vue项目中引入echarts 在 main.js 中 ...

  7. 第七十七篇：ref引用(在vue中引用组件实例)

    好家伙, 为方便理解, 我们先来写一个经典自增一按钮, 再加上一个count清零按钮, Left.vue组件中: <template> <div > <h1>我是L ...

  8. vue中监听页面滚动和监听某元素滚动

    ①监听页面滚动 在生命周期mounted中进行监听滚动: mounted () { window.addEventListener('scroll', this.scrollToTop) }, 在方法 ...

  9. 设置一个div网页滚动时，使其固定在头部，当页面滚动到距离头部300px时，隐藏该div，另一个div在底部，此时显示；当页面滚动到起始位置时，头部div出现，底部div隐藏

    设置一个div网页滚动时,使其固定在头部,当页面滚动到距离头部300px时,隐藏该div,另一个div在底部,此时显示: 当页面滚动到起始位置时,头部div出现,底部div隐藏 前端代码: <! ...

随机推荐

  1. java基本类型和包装类型的区别

    Java的类型分为两部分,一个是基本类型(primitive),如int.double等八种基本数据类型: 另一个是引用类型(reference type),如String.List等.而每一个基本类 ...

  2. selenium-java爬虫实现

    推荐的网站学习网站 1.官方文档 http://www.seleniumhq.org/docs/ 2.selenium多线程 http://www.cnblogs.com/dingmy/p/34380 ...

  3. react-native启动时红屏报错：Unable to load script.Make sure you're either running a metro server or that ....

    一.报错信息内容 我是在Android Studio中运行启动react-native项目时报的这个错误 1.报错提示:Unable to load script.Make sure you're e ...

  4. [易学易懂系列|rustlang语言|零基础|快速入门|（4）|借用Borrowing]

    [易学易懂系列|rustlang语言|零基础|快速入门|(4)] Borrowing 继续讲讲另一个重要的概念:借用(borrowing), 什么是借用? 我们先来看前一文章([易学易懂系列|rust ...

  5. Java基本的程序结构设计 大数操作

    大数操作 BigInteger 不可变的任意精度的整数.所有操作中,都以二进制补码形式表示 BigInteger(如 Java 的基本整数类型).BigInteger 提供所有 Java 的基本整数操 ...

  6. Metafile::EmfToWmfBits的使用

    其中涉及到string转换LPCWSTR以及模块绝对路径的调用 #include <iostream> #include <stdio.h> #include <WIND ...

  7. 2018微信小程序官方示例源码最新版

    忘记从哪获得的 CSDN  可以支持一下 谢谢你们 https://download.csdn.net/download/lan1128/10197682 当然也有免费的 代码在码云上免费公开 点个关 ...

  8. sourceTree 添加 ssh key 方法

    1.使用 git 客户的生成公私钥:id_rsa.id_rsa.pub 1.1设置Git的user name和email: $ git config --global user.name " ...

  9. Idea创建多模块依赖Maven项目

    idea 创建多模块依赖Maven项目   本来网上的教程还算多,但是本着自己有的才是自己的原则,还是自己写一份的好,虽然可能自己也不会真的用得着. 1. 创建一个新maven项目 2. 3. 输入g ...

  10. PIXI兼容微信小游戏

    首先导入官方的weapp-adapter,然后导入pixi.min.js,微信小程序使用ES6的module引用模块,具体参见ES6的Module. import './libs/weapp-adap ...