When validating an element ui form, how to actively trigger the error? of a field based on the error message returned by the background?

1,

 <el-form :inline="true" :model="mainForm" ref="refMainForm" label-width="100px" :rules="mainFormRule" class="demo-form-inline" size="small" label-position="right">
 
    <el-row>
      <el-col :span="6">
        <el-input v-model="mainForm.name" placeholder=""></el-input>
      </el-col>

      <el-col :span="6">
       <el-input v-model="mainForm.position" placeholder=""></el-input>
        </el-form-item>
      </el-col>
      
      <el-button type="primary" @click="createData"></el-button>
  </el-form>

     export default {
      data() {
        var validatePosition = (rule, value, callback) => {
            if (value != "") {
              let patten = /(^[^]+\d+\d+\d+U~\d+U(\([]\)){0,1}$)|(^[^]+\d+\d+\d+U(\([]\)){0,1}$)/
    
              if(patten.test(value) === false){
                callback(new Error("")
              }
              else{
                callback()
              }
    
    
            }
            else{
              callback()
            }
    
          }
        mainFormRule:{
            name:[{ required: true, message: "", trigger: "blur" }],
            position:[{validator:validatePosition, trigger: "blur"}],
        },
      }
      
      methods: {
        createData() {
          //jsnameerror
          this.$refs.refMainForm.fields.filter((item) => (item.prop === "name"))[0]
      },
},

2. I have tried vm.$refs.ruleForm.fields.filter ((item) = > (item.prop = i)) [0];
https://codeshelper.com/q/10.
) but still haven"t solved which one can specify how to use it

Mar.04,2021

this.$refs.ruleForm.fields [0] .error = "error prompt"

Menu