Блог

Я хочу удалить значение модели при изменении manufacturerWatchValue после инициализации формы.

Но модель теряет свое значение при инициализации формы, поскольку инициализированная переменная находится в списке зависимостей. Следовательно, мне пришлось удалить его из списка зависимостей, чтобы заставить его работать.

Несмотря на то, что он работает, как ожидалось, в React говорится, что строка 138: 5: React Hook useEffect имеет отсутствующую зависимость: ‘initialized’. Либо включите его, либо удалите массив зависимостей

Есть ли способ обойти эту ошибку при достижении логики?

 const MyForm = ({ itemId }) => {
    const { watch, setValue, handleSubmit, reset } = useForm()
    const [initialized, setInitialized] = useState(false)
    const manufacturerWatchValue = watch("manufacturer")

    useEffect(() => {
        // Initializing Form Here
        itemId amp;amp;
            (async () => {
                const oneItem = await getOneResult(itemId)
                reset(oneItem)
                setInitialized(true)
            })()

        // Terminating Form Here
        return () => {
            reset({})
            setInitialized(false)
        }
    }, [dispatch, reset, itemId])

    useEffect(() => {
        if (initialized) {
            setValue("model", "")
        }
    }, [manufacturerWatchValue, setValue /*, initialized */])

    const onSubmit = (data) => {
      console.log(data)
    }

    return (
        <form onSubmit={handleSubmit(onSubmit)}>
            <input type="text" name="model" ref={register} />
            <input type="text" name="manufacturer" ref={register} />
        </form>
    )
  

React на самом деле не выдает вам ошибку, вместо этого выдает вам предупреждение eslint.

Вы можете игнорировать конкретную ошибку компоновки, добавив эту строку над ошибкой зависимости:

 // eslint-disable-next-line
  

Пример

 useEffect(() => {
  console.log("My code")
  
  // eslint-disable-next-line
}, [])