reactjs - React JS - 使用数学逻辑的引导表单验证

Question

我有一个带有两个输入 ValA 和 ValB 的 react bootstrap 表单（下面的代码）

我想检查 valB<valA 如果不是，那么我想用红色突出显示，如果是这样，则不允许用户按下提交按钮/将其变灰

我怎样才能做到这一点？

    <div>
        <Form>
            <Form.Row className="d-flex align-items-end">
                <Form.Group as={Col} controlId="formValA">
                    <Form.Label>Val A</Form.Label>
                    <Form.Control type="number" value={valA} onChange={handleValAChange} />
                </Form.Group>

                <Form.Group as={Col} controlId="formValB">
                    <Form.Label>Val B</Form.Label>
                    <Form.Control type="number" value={valB} onChange={handleValBChange}/>
                </Form.Group>

                <Form.Group as={Col} controlId="formSubmit">
                    <Button onClick={handleSubmit}>Submit</Button>
                </Form.Group>
            </Form.Row>
        </Form>
    </div>