Символ проверки формы Redux не отображается в браузере? - PullRequest
Новая
       51

Символ проверки формы Redux не отображается в браузере?

1 голос
/ 07 апреля 2020

Если вы go заходите на этот веб-сайт https://redux-form.com/7.2.0/examples/fieldlevelvalidation/, это показывает, что если поле пустое, появляется это сообщение об ошибке «Обязательный» с восклицательным знаком: изображение сообщения об ошибке

Это код поля в моем файле .tsx: 

<Field component={renderField} type="text" id="jobid" name="jobids"
    placeholder="enter id"
    validate={[FormValidation.required, FormValidation.jobids]}/>

Это соответствующие функции экспорта в моем файле .ts: 

export class FormValidation {
        public static required = (value: string) => value ? undefined : 'Required';
}

Однако для моего проекта вместо восклицательного знака отображается квадрат ошибки. Я проверял это в Chrome, Firefox и Safari. Это происходит на моем компьютере и компьютерах некоторых коллег, и мы все используем ОС Ma c. Однако для одного из моих коллег восклицательный знак отображается правильно, и он использует Windows. Любая идея, что может быть причиной этого и как это исправить? Заранее спасибо.

1 Ответ

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

Похоже, что FontAwesome не загружен, и поэтому значок не появляется, поскольку он не знает, как отобразить этот глиф.

Насколько я могу судить, FontAwesome не является зависимостью для избыточной формы, так что вам придется попробовать включить ее вручную где-нибудь в вашем проекте, например, в индекс. html примерно так: 

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" integrity="sha256-eZrrJcwDc/3uDhsdt61sL2oOBY362qM3lon1gyExkL0=" crossorigin="anonymous" />

Это работает на сайте документации Redux Form, потому что они включил ссылку в тег head документа, который загружает шрифт из того же CDN в том же фрагменте выше.

Что касается того, почему он появляется на компьютере windows вашего коллеги, я действительно не уверен. Я полагаю, если он установил FontAwesome как локальный шрифт, чтобы он мог использовать его и мог правильно отображать глиф.

...