Formik проверить реагировать Рейтинг компонента - PullRequest
0 голосов
/ 06 апреля 2020

Мне нужно проверить компонент Form рейтинга Formik, чтобы сделать его обязательным, по умолчанию звездочки не выбраны. Итак, у меня есть код в моем компоненте:

validateRating(value) {

    let error;
    if (!value || value === 0) {
        error = 'Required';
    }
    return error;
}  

render() {

    const ModelSchema = Yup.object().shape({
        rating: Yup.number()
            .required('Please rate this product.'),
       });

    return (
        <div>
            <Formik ...


<Field name="rating" id="rating" type="number" validate={this.validateRating}>
    {({ field: { value }, form: { setFieldValue } }) => (
    <div>
        <Rating
            placeholderRating={3}
            emptySymbol={<FontAwesomeIcon icon={farStar} size="lg" style={{color:"#aaa"}} />}
            fullSymbol={<FontAwesomeIcon icon={fasStar} size="lg" style={{color:"#ffd200"}} />}
            placeholderSymbol={<FontAwesomeIcon icon={fasStar} size="lg" style={{color:"#aaa"}} />}
            onChange={this.ratingChange} initialRating={this.state.Rating}
        />                                                                        

    </div>
    )}
</Field>
<ErrorMessage name="rating" component="small" className="form-text text-danger" />

Он входит в функцию validateRating, но с неопределенным значением. Цени любую помощь, что я делаю не так. Спасибо!

1 Ответ

0 голосов
/ 06 апреля 2020

Мне нужно было установить начальное значение в initialValues ​​

<Formik
    initialValues={{
        rating: 0
    }}

, и это работает. Надеюсь, это может кому-то помочь. Спасибо.

...