elementui form表单自定义验证不加rules 星号*

tem

  <el-form-item label="晚餐:">
          <template slot-scope="scope">
            <div class="table_td_cell" :class="{ res_border: text3 !== '' }">
              <el-input
                type="textarea"
                v-model="ruleForm.dinnerContent"
                @input="changeValue3"
              ></el-input>
            </div>
            <div class="res_text">
              {{ text3 }}
            </div>
          </template>
        </el-form-item>

css

res_border样式:
.res_text {//红色验证文字“菜品名称重复，请检查后重新填写”,“不能超过500个字符”
  color: #f56c6c;
  font-size: 12px;
  line-height: normal;
}
.res_border >>> .el-textarea__inner {//红色边框
  border: 1px #f56c6c solid;
}

text3=' ' 
    changeValue3(val) {
      let arr3 = val.split(",");//此处将输入的内容 根据逗号区分 到数组中的参数
      if (val.length > 500) {
        this.text3 = "不能超过500个字符";
      } else {
        this.text3 = "";
        let nary3 = arr3.sort();
        for (var i = 0; i < nary3.length - 1; i++) {//循环数组 判断每一项是否与前一项相同
          if (nary3[i] == nary3[i + 1]) {
            this.text3 = "菜品名称重复，请检查后重新填写";
            return;
          }
        }
      }
    },