vue Dialog对话框滚动条自动定位到顶部或者底部

需要实现的效果是，在打开的时候，让对话框的滚动条自动定位到顶部解决：写在生命周期updated里面可以完美定位！updated(){// 对话框定位到顶部let ele = document.getElementById('chatRecord');ele.scrollTop = 0;// 对话框定位到底部let ele = document.getElementById('chatRecord'

Fxhani

7564人浏览 · 2020-06-23 18:03:21

Fxhani · 2020-06-23 18:03:21 发布

需要实现的效果是，在打开的时候，让对话框的滚动条自动定位到顶部

在这里插入图片描述

解决：写在生命周期updated里面可以完美定位！

updated(){
    // 对话框定位到顶部
        let ele = document.getElementById('chatRecord');
        ele.scrollTop = 0;
        
	// 对话框定位到底部
        let ele = document.getElementById('chatRecord');
        ele.scrollTop = ele.scrollHeight;
    },

给带有滚动条的div一个id
在这里插入图片描述

如果是想实现点击取消按钮使对话框定位到顶部，直接给按钮一个点击事件

在这里插入图片描述

Vue

前往低代码交流专区

更多推荐

vue 表单验证

1、6位小写字母和数字必须包含两个字母rules: [{ required: true, message: "XXX不能为空", trigger: "blur" },{ max: 6, message: "最大长度为6位字符", trigger: "blur" },{pattern: /^(?=(?:[^a-z]*[a-z]){2})[a-z0-9]{6,6}$/, //不连续的两位字母// /^