element ui 表单验证时怎么根据后台返回的错误信息主动触发某个field的error？

Question

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() {
          //这里假设服务器已经返回错误，模拟用js去触发绑定name字段的error
          this.$refs.refMainForm.fields.filter((item) => (item.prop === 'name'))[0]
      },
},

2、已尝试过vm.$refs.ruleForm.fields.filter((item) => (item.prop === i))[0];
https://segmentfault.com/q/10...
但是仍没有解决 希望哪位能具体说下使用方法

Answer 1

this.$refs.ruleForm.fields[0].error="错误提示"