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

Question

我用 Laravel / Vuejs 和 Element-ui 创建了一个应用程序。在我的表单中，我使用 property: error 来告诉我的字段我正在使用 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>

在以下链接（http://element.eleme.io/#/en-US/component/form#validation）上，我们可以看到当出现错误时，该字段变为红色（它适用于我）并且当我们正确填写该字段，该字段变为绿色。

当出现错误时，validateState 数据获取值“error”。用作:error验证，当验证正确时，属性不会传入“成功”，这使得触发绿色字段成为可能。

如链接示例所示，当错误得到纠正时，如何使 validateState 成功通过？

非常感谢您

标签： javascriptlaravelvue.jsvuejs2element-ui

Answer 1

如果要is-success手动设置类，可以将is-success类绑定到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>