element-ui 无法对绑定表单的对象中的对象属性进行验证
<el-form-item label="类型" :label-width="formLabelWidth" prop="typeId">
<template>
<el-select v-model="form.typeId" clearable
placeholder="请选择">
<el-option v-for="type2 in types" :key="type2.id"
:label="type2.name" :value="type2.id">
</el-option>
</el-select>
</template>
</el-form-item>
<el-form-item label="设计师" :label-width="formLabelWidth" prop="designer.id">
<template>
<el-select v-model="form.designer.id" clearable
placeholder="请选择">
<el-option
v-for="designer in designers" :key="designer.id"
:label="designer.name" :value="designer.id">
</el-option>
</el-select>
</template>
</el-form-item>
如果是直接绑定属性,是可以的,但是绑定对象中的属性就需要特别处理,需要在rules中添加双引号 " "
data:function() {
return {
form: {id:"",name:"",code:"",config:"",designer:{id:""}},
types:[],
diyResourceImgs:[],
designers:[],
formLabelWidth:"100px",
uploading:false,
uploadings:false,
//rules 加校验
rules: {
name: [
{ required: true, message: '请输入素材名称', trigger: 'blur' },
],
code: [
{ required: true, message: '请输入素材编号', trigger: 'blur' },
],
price: [
{ required: true, message: '请输入素材价格', trigger: 'blur' },
],
typeId: [
{ required: true, message: '请选择类型', trigger: 'blur' },
],
"designer.id":[
{required:true,message: '请选择类型',trigger:'blur'},
]
}
}
},
element-ui 无法对绑定表单的对象中的对象属性进行验证的更多相关文章
- Element Ui使用技巧——Form表单的校验规则rules详细说明
Element UI中对Form表单验证的使用介绍: Form 组件提供了表单验证的功能,只需要通过 rules 属性传入约定的验证规则,并将 Form-Item的 prop 属性设置为需校验的字段名 ...
- spring boot:使用validator做接口的参数、表单、类中多字段的参数验证(spring boot 2.3.1)
一,为什么要做参数验证? 永远不要相信我们在后端接收到的数据, 1,防止别人通过接口乱刷服务:有些不怀好意的人或机构会乱刷我们的服务,例如:短信接口, 相信大家可能很多人在工作中遇到过这种情况 2,防 ...
- DHTMLX 前端框架 建立你的一个应用程序 教程(九)--绑定表单Form到表格Grrid中
绑定表单Form到表格Grrid中 现在我们需要选中一行表格数据的时候 数据能在表单中显示出来 我们可以使用DHTMLX 丰富的组件功能实现它. 绑定表单到表格 1.调用bind方法将表单绑定到网格, ...
- amaze UI 如何添加原生表单验证
这段时间做的一个项目,整个系统就一个页面,然后就是各种模态框,js里拼HTML代码,而且因为表单空留距离小,最后选定了amaze ui原生的表单验证 在amaze ui官网找到 表单验证. 但是ama ...
- vue指令:v-model绑定表单控件;v-model与v-bind结合使用
一.v-model绑定表单控件 v-model 双向数据绑定:一般用于表单元素,会忽略表单元素的value.checked.selected的初始值,且将Vue实例的数据作为数据来源. 1. 单行文本 ...
- 一款基于jquery ui的动画提交表单
今天要给大家分享一款基于jquery ui的动画提交表单.这款提交表单的的效果是以动画的形式依次列表所需填写的信息.效果非常不错,效果图如下: 在线预览 源码下载 实现的代码. html代码: & ...
- SpringMVC表单或Json中日期字符串与JavaBean的Date类型的转换
SpringMVC表单或Json中日期字符串与JavaBean的Date类型的转换 场景一:表单中的日期字符串和JavaBean的Date类型的转换 在使用SpringMVC的时候,经常会遇到表单中的 ...
- 一、表单和ajax中的post请求&&后台获取数据方法
一.表单和ajax中的post请求&&后台获取数据方法 最近要做后台数据接收,因为前台传来的数据太过于混乱,所以总结了一下前台数据post请求方法,顺便写了下相对应的后台接收方法. 前 ...
- php开发面试题---2、php常用面试题二(表单提交方式中的get和post有什么区别)
php开发面试题---2.php常用面试题二(表单提交方式中的get和post有什么区别) 一.总结 一句话总结: 数据位置:get参数在url里面,post在主体里面 数据大小:get几kb,pos ...
- Spring绑定表单数据
Spring提供了一些jsp页面常用的form标签,很大程度上提高了我们开发的速度,不用再一个个的标签去绑定属性,而且后台接收数据也很简单,可以直接接收object对象作为属性.官方form标签介绍的 ...
随机推荐
- Zabbix 5.0:服务端进程总结
Blog:博客园 个人 参考:<深入理解Zabbix监控系统>.<Zabbix用户手册> Zabbix服务端进程被分为不同的种类,每一种进程负责相应的任务,包括收集原始监控数据 ...
- Typora下载及MarkDown语法详解
写博客的重要性 作为一名程序员,写博客已经成了一项基本技能和素养.为什么要写博客?因为它能将我们学习的知识总结起来,提高我们对知识的深层次理解,还能将我们所学知识记录下来,以便于以后回忆.要想写博客, ...
- vim中的incsearch不好用,没有动态效果,为什么——incsearch is not working
虽然使用Linux好多年了,使用vim也好多年了,但是使用vim进行search的时候重来也没有想过要添加动态效果,近来突然有了兴致想要添加这个功能,不过发现居然不好用,在百度上找了好长时间居然没有一 ...
- 【C# 锁】 SpinLock锁 详细分析(包括内部代码)
OverView 同步基元分为用户模式和内核模式 用户模式:Iterlocked.Exchange(互锁).SpinLocked(自旋锁).易变构造(volatile关键字.volatile类.Thr ...
- SQL Server Cross/Outer Apply
SQL Server2005引入了APPLY运算符,它非常像连接子句,它允许两个表达式直接进行连接,即将左/外部表达式和右/内部表达式连接起来. CROSS APPLY(类比inner join)和O ...
- HTML分块
<!DOCTYPE html><html><head> <meta charset="utf-8"> <title>菜鸟 ...
- parquet列存储本身自带压缩 配合snappy或者lzo等可以进行二次压缩
上传txt文件到hdfs,txt文件大小是74左右. 这里提醒一下,是不是说parquet加lzo可以把数据压缩到这个地步,因为我的测试数据存在大量重复.所以下面使用parquet和lzo的压缩效果特 ...
- Python:GUI库tkinter(三)
这一章是对前两章的总结: Python:GUI库tkinter(一) Python:GUI库tkinter(二) 前两章是对控件的介绍,第一章可以知道各控件使用时的具体参数,第二章以具体的例子展示了每 ...
- 分布式 PostgreSQL 集群(Citus)官方示例 - 多租户应用程序实战
如果您正在构建软件即服务 (SaaS) 应用程序,您可能已经在数据模型中内置了租赁的概念. 通常,大多数信息与租户/客户/帐户相关,并且数据库表捕获这种自然关系. 对于 SaaS 应用程序,每个租户的 ...
- [] == ![] 返回 true
对于==来说,如果数据类型不同,就会进行隐式类型转换. 首先判断是否在对比 null 和 undefined,是的话就会返回 true: 判断其中一方是否为 string ,在与 number进行比较 ...