关于el-form中的rules未生效问题

关于el-form中的rules未生效问题

需求场景:上半部分的输入框以及下拉框使用行内表单,下半部分不用行内表单,只有el-form有inline参数,所以只能嵌入两个el-form标签,必填输入框需要表单校验,嵌入表单时,导致校验无效

当嵌入两个el-form时,需要注意的点

关于el-form中的rules未生效问题_第1张图片

data() {
    return {
		rules: {
		  projectId: [{ required: true, message: '项目必填', trigger: 'change' }],
		  moduleId: [{ required: true, message: '模块必填', trigger: 'change' }],
		  interfaceUrl: [{ required: true, message: '请求地址必填', trigger: 'change' }]
		},
},
methods: {
	addOrUpdateData() {
      this.$refs['ruleForm'].validate((valid) => {
        if (valid) {
        	alert('校验通过')
        }
      }
    }
}

第一次写,写的不是特别好,希望大家多担待

你可能感兴趣的:(vue.js,前端,javascript)