使用Reactstrap和/或availity-reactstrap-validation与AvField是否可以在输入有效项目时显示绿色“有效”框？

Question

现在，使用这个：

                        <AvField name="name" label="Name (default error message)" type="text" errorMessage="Invalid name" validate={{
                        required: {value: true},
                        pattern: {value: '^[A-Za-z0-9]+$'},
                        minLength: {value: 6},
                        maxLength: {value: 16}
                    }} />

如果模式不匹配，它会显示红色轮廓和危险标记，这很棒，但我也希望它在模式匹配时显示绿色轮廓和复选标记。这真的是一个选择吗？

谢谢！！！

Answer 1

有一个道具是“有效”的，如果输入有效，那么 avField 会自动将颜色更改为绿色。

例如：