首页 > 其他分享 >elementui 长表单验证滚动到首个错误位置

elementui 长表单验证滚动到首个错误位置

时间:2023-09-02 17:35:16浏览次数:43  
标签:滚动 验证 elementui 表单 valid isError

this.$refs['form'].validate(valid => {
    if(valid){
        // 验证通过
        
    } else {
        // 验证失败
        this.$nextTick(() => {
            let isError = document.getElementsByClassName('is-error')
	        isError[0].scrollIntoView({
		        block: 'center',
		        behavior: 'smooth'
	       })
	   })
    }
})

 

标签:滚动,验证,elementui,表单,valid,isError
From: https://www.cnblogs.com/Intellectualscholar/p/17662316.html

相关文章

  • Webkit 实现页面滚动条美化
    当页面或者某个容器布局内容超出过后,就会有滚动条,但默认的有点丑,经常需要自己来美化一下,这里做个笔记吧./*美化全局的滚动条*/::-webkit-scrollbar{width:4px;height:6px;}::-webkit-scrollbar-corner{display:block;}::-webkit-scrollbar-thumb{......
  • js获取元素滚动高度,body高度...
    获取浏览器显示区域(可视区域)的高度:  $(window).height();  获取浏览器显示区域(可视区域)的宽度:$(window).width();  获取页面的文档高度  $(document).height();  获取页面的文档宽度:$(document).width(); 浏览器当前窗口文档body的高度:  $(document.body).he......
  • JS 获取form表单的所有数据
    在HTML中用js获取通过GET、POST方法(就是在网址后加?a=b&c=d之类)传过来的表单值。针对大家常用的获取表单方式,很多时候都是在重复的写一些代码,今天给大家贴出来的代码可以作为公用方法直接调用。可以提高大家的开发效率。html<body><formid="login"name="login"......
  • el-table不出现滚动条
    修改样式的时候,发现没出现自己想要的效果,用div重新布局以后,发现效果是出现了,但el-table滚动条不见了。解决:<divstyle="padding:2px;height:600px"><el-tablev-loading="loading":data="list"highlight-current-rowsty......
  • ElementUI 全局设置组件的默认属性
    importElementUIfrom'element-ui'Element.Input.props.clearable.default=true;JS复制全屏原生属性通常情况下,以maxlength属性为例importElementUIfrom'element-ui'constrender=ElementUI.Input.render;ElementUI.Input.render=function(){......
  • 金蝶云星空表单插件-按钮弹窗(二开)
    现场需求:销售订单添加测试按钮,弹窗文字。 方案设计:销售订单扩展,添加按钮。新增销售订单表单类,继承表单类,重写按钮点击事件,判断点击按钮进行弹窗。  具体实现:1、引入销售订单 引入后: 2、扩展销售销售订单 扩展后会打开销售订单界面:  修改标识:  ......
  • vue横向滚动,并且实现点击左右按钮来进行滚动
    直接上代码,可以点击左和右两个汉字进行横向滚动<template><divclass="Home"><divstyle="display:flex;height:100%;align-items:center;"><div@click="scrollLeft('scrollContainer1')"style=&q......
  • js面向对象浅析-表单生成
    js面向对象浅析-表单生成前言:这里就表单生成器的案例对js面向对象分析一下。。。(function(window){varFormBuilder=function(data){this.data=data;};window.FormBuilder=FormBuilder;})(window);FormBuilder.prototype.create=function(){va......
  • Vue【原创】基于elementui的分组多选下拉框【group-list】
    效果图: 如图分为多选模式和单选模式。 group-select:1<template>2<div>3<el-select4v-model="innerValue"5:placeholder="placeholder"6@change="changeSelect"......
  • DWR util.js 整理(DWR 处理各种form表单Select/option,table等,
    /********************/util.js包含一些有用的函数function,用于在客户端页面调用.主要功能如下:代码$()获得页面参数值addOptionsandremoveAllOptions初始化下拉框addRowsandremoveAllRows填充表格getText取得text属性值getValue取得form表......