如何在 element-ui vuejs 中使用 :error 获得成功的 validateState

Question

我使用 Laravel/Vuejs 和 Element-ui 创建了一个应用程序。在我的表单中，我使用 属性: 错误告诉我的字段我正在使用 Laravel 验证。

<el-form-item label="Prénom" prop="firstname" :error="registerForm.errors.get('firstname')">
    <el-input name="firstname" id="firstname" v-model="registerForm.firstname">
    </el-input>
/el-form-item>

在下面的link(http://element.eleme.io/#/en-US/component/form#validation)中我们可以看到，当出现错误时，该字段变为红色（我的工作正常），当我们正确填写该字段时，该字段变成绿色。

当出现错误时，validateState 数据获取值"error"。使用:error作为验证，当验证正确时，属性不会传入"success"，从而可以触发绿色字段。

如何在link的例子中改错后让validateState成功通过？

非常感谢

Answer 1

如果要手动设置is-successclass，可以绑定is-successclass到el-form-item

<el-form-item label="Prénom" prop="firstname" :error="registerForm.errors.get('firstname')"
:class="{'is-success': !registerForm.errors.get('firstname')}">
    <el-input name="firstname" id="firstname" v-model="registerForm.firstname">
    </el-input>
</el-form-item>