element-ui 表单 v-if 不能验证问题
element-ui 表单v-if 很多人会遇到无法验证的问题,网上很多是在el-form-item标签前加一个div然后把v-if拿到div上去像这样
<div v-if="addchannel.region=='postgresql'||addchannel.region=='mongodb'||addchannel.region=='mysql'||addchannel.region=='influxdb'"
class="notlastchildren notline">
<el-form-item
:label="addchannel.region+'密码'"
label-width="200px"
prop="postgresqlpassword"
:rules='[
{required:true,message:"密码不能为空",trigger: "blur"}
]'
>
<el-input
:type="pwdType"
placeholder="密码"
v-model="addchannel.postgresqlpassword"
class="notauto readonly"
readonly
>
<template slot="append">
<span class="show-pwd" @click="showPwd">
<svg-icon :icon-class="isopen" />
</span>
</template>
</el-input>
</el-form-item>
</div>
这样也有可能不行,其实再套一层div就可以了
<div v-if="addchannel.region=='postgresql'||addchannel.region=='mongodb'||addchannel.region=='mysql'||addchannel.region=='influxdb'"
class="notlastchildren notline">
<div>
<el-form-item
:label="addchannel.region+'密码'" label-width="200px"
prop="postgresqlpassword"
:rules='[
{required:true,message:"密码不能为空",trigger: "blur"}
]'
>
<el-input
:type="pwdType"
placeholder="密码"
v-model="addchannel.postgresqlpassword"
class="notauto readonly"
readonly
>
<template slot="append">
<span class="show-pwd" @click="showPwd">
<svg-icon :icon-class="isopen" />
</span>
</template>
</el-input>
</el-form-item>
</div>
</div>
element-ui 表单 v-if 不能验证问题的更多相关文章
- 关于vue.js element ui 表单验证 this.$refs[formName].validate()的问题
方法使用前需了解: 来自”和“小编的小提示: 首先打印一下this.$refs[formName],检查是否拿到了正确的需要验证的form. 其次在拿到了正确的form后,检查该form上添加 ...
- vue开源Element UI表单设计及代码生成器
在日常的开发工作中,表单开发是较为繁琐且重复的.本文介绍一个我自己写的,提高开发效率的小工具. 1 可视化设计器 设计器基于Element UI ,可通过点击或拖拽的方式设计基本表单, 设计器生成的代 ...
- vue踩坑:vue+ element ui 表单验证有值但验证失败。
一.如图:有值但是验证失败 二. <el-form :model="form" :rules="rules"> <el-form-item l ...
- (vue.js)element ui 表单重置
el-form需要接收一个model,并且需要配合el-form-item一起使用,并且在el-form-item上绑定prop属性,resetField方法才能好使. <el-form :mo ...
- vue+element 动态表单验证
公司最近的项目有个添加动态表单的需求,总结一下我在表单验证上遇到的一些坑. 如图是功能的需求,这个功能挺好实现的,但是表单验证真是耗费了我一些功夫. vue+element在表单验证上有一些限制,必须 ...
- AngularJS 表单提交后显示验证信息与失焦后显示验证信息
虽然说AngularJS的实时表单验证非常有用,非常高效方便,但是当用户还没有完成输入时便弹出一个错误提示,这种体验是非常糟糕的. 正常的表单验证逻辑应该是在用户提交表单后或完成当前字段中的输入后,再 ...
- 自制“低奢内”CSS3注册表单,包含JS验证哦。请别嫌弃,好吗?。
要求 必备知识 基本了解CSS语法,初步了解CSS3语法知识.和JS/JQuery基本语法. 开发环境 Adobe Dreamweaver CS6 演示地址 演示地址 预览截图(抬抬你的鼠标就可以看到 ...
- Element Form表单实践(上)
作者:小土豆biubiubiu 博客园:https://www.cnblogs.com/HouJiao/ 掘金:https://juejin.im/user/58c61b4361ff4b005d9e8 ...
- Element Form表单实践(下)
作者:小土豆biubiubiu 博客园:https://www.cnblogs.com/HouJiao/ 掘金:https://juejin.im/user/58c61b4361ff4b005d9e8 ...
- EasyUI中在表单提交之前进行验证
使用EasyUi我们可以在客户端表单提交之前进行验证,过程如下:只需在onSubmit的时候使用return $("#form1").form('validate')方法即可,E ...
随机推荐
- 机场&代理商-关系图
机场&代理商-关系图 思路 ①首先统计机场活跃度Top10的机场名称,以下是我的表结构,以及查询语句 表结构: 查询语句:SELECT * from 2020csale ORDER BY cn ...
- Docker Vs Podman
翻译自 Chetansingh 2020年4月24日的博文<Docker Vs Podman> [1] 容器化的一场全新革命是从 Docker 开始的,Docker 的守护进程管理着所有的 ...
- 一次SQL注入导致的"越权"
原文来自SecIN社区-作者:tkswifty 相关背景 在实际的业务开发中,SQL交互往往是业务系统中不可或缺的一项.在Java中提供了类似Mybatis.Hibernate.SpringDat ...
- 《应用计算方法教程》matlab作业一
运行界面: 运行界面: 运行界面: 运行界面: 运行界面: 运行界面: 运行界面: 运行界面: 运行界面: 运行界面: word文档百度云链接: 链接:https://pan.baidu.com/s/ ...
- 2014.04.28基于CPLD的LCOS场序彩色视频控制器设计
基于CPLD的LCOS场序彩色视频控制器设计 作者:宋丹娜,代永平,刘艳艳,商广辉 发表刊物:液晶与显示,2009 学习时间:2014.04.28 文章讲述了-- (和上一篇论文有些相似之处) 1. ...
- 安装pillow报错处理
sudo python3 pip install pillow 报错:The headers or library files could not be found for jpeg,... 解决:安 ...
- moviepy音视频剪辑VideoClip类fl_image方法及参数image_func的功能介绍
☞ ░ 前往老猿Python博文目录 ░ moviepy音视频剪辑模块的视频剪辑基类VideoClip的fl_image方法用于进行对剪辑帧数据进行变换. 调用语法:fl_image(self, im ...
- 敏捷开发(Scrum)与敏捷测试
1.敏捷测试流程和传统测试流程 软件测试是贯穿整个软件开发生命周期.对软件产品(包括阶段性产品)进行验证和确认的活动过程,也是对软件产品质量持续的评估过程,其目的是尽快尽早地发现在软件产品(包括阶段性 ...
- LeetCode初级算法之数组:26 删除排序数组中的重复项
删除排序数组中的重复项 题目地址:https://leetcode-cn.com/problems/remove-duplicates-from-sorted-array/ 给定一个排序数组,你需要在 ...
- Gradle上传依赖到私服(nexus)
子模块配置 buildscript { repositories { mavenLocal() maven { url "http://maven.aliyun.com/nexus/cont ...