Как скрыть введенное обязательное сообщение «пожалуйста, заполните это поле»

Question

Я добавил свойство required к своему input, и я просто хочу оставить цвет рамки без сообщения "Пожалуйста, заполните это поле". Можно ли скрыть это сообщение?

<input
    placeholder={protocolPlaceholder}
    id="numProtocol"
    onChange={(e) => handleOnChange(e)}
    value={numProtocol}
    required
/>

Answer 1

Это в основном подсказка HTML5, которая поставляется вместе с атрибутом required, чтобы решить эту проблему, попробуйте добавить в DOM пустую форму, например:

<form id="novalidateform" novalidate />

Затем добавьте form="novalidateform" Свойство для ввода:

<input
 form="novalidateform"
 placeholder={protocolPlaceholder}
 id="numProtocol"
 onChange={(e) => handleOnChange(e)}
 value={numProtocol}
 required
/>

Обратите внимание, что пустая форма id и значение prop form, заданные для ввода, должны совпадать.

Подробнее об этом.