data(){
<el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="100px" class="demo-ruleForm">
<el-form-item label="选择分类" prop="sorts">
<el-cascader
:options="options"
change-on-select
filterable
v-model="ruleForm.sorts"
clearable></el-cascader>
</el-form-item>
</el-form>
/*表单验证*/
ruleForm: {
sorts: '',
},
/*验证规则*/
rules: {
sorts: [
{required: true, message: '请选择分类', trigger: 'change'}
],
},
}

element-ui设置级联选择器表单验证的更多相关文章

  1. Element Ui使用技巧——Form表单的校验规则rules详细说明

    Element UI中对Form表单验证的使用介绍: Form 组件提供了表单验证的功能,只需要通过 rules 属性传入约定的验证规则,并将 Form-Item的 prop 属性设置为需校验的字段名 ...

  2. amaze UI 如何添加原生表单验证

    这段时间做的一个项目,整个系统就一个页面,然后就是各种模态框,js里拼HTML代码,而且因为表单空留距离小,最后选定了amaze ui原生的表单验证 在amaze ui官网找到 表单验证. 但是ama ...

  3. 基于element ui的级联选择器组件实现的分类后台接口

    今天在做资产管理系统的时候遇到一个分类的级联选择器,前端是用的element的组件,需要后台提供接口支持.     这个组件需要传入的数据结构大概是这样的,详细的可参考官方案例: [{ value: ...

  4. element UI Cascader 级联选择器 编辑 修改 数组 路径 问题(转载)

    来源:https://segmentfault.com/a/1190000014827485 element UI的Cascader级联选择器编辑时 vue.js element-ui 2 eleme ...

  5. HTML5伪类选择器表单验证

    input : required   选择必填表单域 input : focus : invalid 选择当前聚焦的且含有非法输入值的表单域 input : focus : valid 选择当前聚焦的 ...

  6. Element UI:级联选择器Cascader_动态加载_多级请求不同接口(已知第一级调取第二级)

    ELEMENT UI_CASCADER 使用过饿了么级联动态加载的小伙伴应该都知道,lazyLoad本身是一个无差别返回渲染结点的函数. 当我们存在一个需求:已知级联选择器的第一级结点,现在需要通过第 ...

  7. 记录一下使用element ui使用级联选择器的坑,级联选择器的默认选中

    Cascader 级联选择器 使用级联选择器我使用的是默认选中值 下面是我的数据格式,只是形式相同,值不同, 后台的数据是这样的不是ID //级联选择器 <el-cascader :props= ...

  8. 有关vue中用element ui 中的from表单提交json格式总是有冒号的问题解决办法

    因为后台要求要传递JSON格式的数据给他,然后我转了之后总是多了冒号,后来又看了自己的报错,原来是报了404错误,说明路径找不到, 数据格式 后来发现怎么都不行了,然后突然查看了报错报的是404,说明 ...

  9. element Ui的级联选择器 任意一级选中下拉框自动关闭

    封装成一个子组件 <template> <el-cascader v-model="value" clearable placeholder="请选择& ...

随机推荐

  1. C++的逗号运算符

    逗号运算符( , )是C++语言运算符中优先级最低的一种运算符,结合顺序是从左至右,用来顺序求值(最后一个逗号后面表达式的值作为整个表达式的值). 感觉这个东西还是挺冷门的,之前都不知道,平时也比较少 ...

  2. Oracle的number数据类型

    https://www.cnblogs.com/oumyye/p/4448656.html NUMBER ( precision, scale) precision表示数字中的有效位;如果没有指定pr ...

  3. mybatis源码配置文件解析之五:解析mappers标签(解析XML映射文件)

    在上篇文章中分析了mybatis解析<mappers>标签,<mybatis源码配置文件解析之五:解析mappers标签>重点分析了如何解析<mappers>标签中 ...

  4. Asp.net Core AOP实现(采用Autofac)

    引用正确的库来实现AOP 新的.NET Core是基于.NET Standard的..所以我们在引用库的时候特别要注意相关的兼容问题. 在传统的ASP.NET中,使用过Autofac来进行AOP操作的 ...

  5. 吐血推荐,想进BAT必看

    不必太纠结于当下,也不必太忧虑未来,人生没有无用的经历,当你经历过一些事情后,眼前的风景已经和从前不一样了.--村上春树 一.包含如下内容 ActiveMQ消息中间件面试专题 BAT80道面试题 BA ...

  6. 安卓移动端line-height垂直居中出现偏移的原因,及解决方法

    目前在移动端安卓手机上使用line-height属性,让它的值等于height,结果发现是不居中的.出现了一定位置的偏移情况,如果略微只有两三个像素差距是看不出来的. 左图中的字号是12px,右图中的 ...

  7. expected single matching bean but found 2: menusServiceImpl,IMenusService

    问题如下: 接口也作为匹配的bean? 有点迷惑了....... 经过在网上找资料,发现和@MapperScan这个注解有关系,具体源码不止.但是这个注解会扫描路径下的所有类. 去掉这个注解就可以正常 ...

  8. P3574 FAR-FarmCraft 题解

    题目 In a village called Byteville, there are \(n\) houses connected with \(n-1\) roads. For each pair ...

  9. ATM + 购物车项目

    ''' 存放配置文件 ''' import os #获取项目根目录 BASE_PATH=os.path.dirname(os.path.dirname(__file__)) #获取用户目录 USER_ ...

  10. Howdoo 纳入华为生态系统

    原文链接:https://howdoo.io/howdoo-and-huawei-appgallery/ 重点摘要: 我们是华为设备的忠实粉丝,因此我们非常高兴地宣布,我们一直在积极讨论如何开发 Ho ...