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>