axrising
@axrising

Как сделать валидацию для добавления изображений в useState?

Как я могу реализовать валидацию добавления изображений в useState?
Я сделал некую валидацию по добавлению изображений (максимум 4), но её легко обойти добавив сперва 3 или меньше изображений и потом еще какое-то количество, то есть она работает только когда пользователь выберет в первый раз больше 4 картинок, но сделав две попытки он эту валидацию сможет обойти. Буду благодарен за помощь

export interface ImageObj {
  blobUrl: string
  file: File
}
 const onSelectImage = React.useCallback((e: React.ChangeEvent<HTMLInputElement>) => {
    const files = e.target.files
    if (files) {
      const imgArray: Array<File> = Array.from(files)

      if (imgArray.length <= 4) {
        const newState = imgArray.map((file: File) => ({
          blobUrl: URL.createObjectURL(new Blob([file])),
          file,
        }))
        setImages((prev: ImageObj[]): Array<ImageObj> => [...prev, ...newState])
      } else {
        enqueueSnackbar('Max 4 photos.', {
          variant: 'info',
        })
      }
    }
  }, [])
  • Вопрос задан
  • 52 просмотра
Пригласить эксперта
Ответы на вопрос 1
Krasnodar_etc
@Krasnodar_etc
little front
if ((prev.length + imgArray.length) <= 4)
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы