Могут ли различные очистки быть выполнены условно при использовании эффекта? - PullRequest
1 голос
/ 24 января 2020

Итак, у меня есть useEffect вот так:

useEffect(()=>{
    if(foo) {
        // do something
        return () => { // cleanup function }
    }
}, [foo])

Здесь функция cleanup никогда не вызывается, даже если выполняется блок if. Но если я изменю эффект так:

useEffect(()=>{
    if(foo) {
        // do something
    }
    return () => { // cleanup function }
}, [foo])

, это сработает. Итак, выполняется ли очистка, только если return является последним утверждением useEffect или я что-то упускаю?

Ответы [ 3 ]

1 голос
/ 24 января 2020

Вы можете вернуть только одну функцию, которая выполняет очистку. Если вы не вернете функцию, никакой очистки не произойдет. Если вам нужны условные очистки, вы можете переместить логи c в возвращаемую вами функцию:

useEffect(()=>{
    if(foo) {
        // do something
    }

    return () => { 
      if(foo) {
        // cleanup something
      }
    }
}, [foo])
0 голосов
/ 27 января 2020

Нет, это невозможно сделать .... очистка в обработчике useEffect запускается только при размонтировании компонента

0 голосов
/ 24 января 2020

Когда вы возвращаете функцию в обратном вызове, переданном в useEffect, возвращаемая функция будет вызываться до удаления компонента из пользовательского интерфейса.

Обычно мы выполняем очистки в componentWillUnmount для класса на основе составная часть. Допустим, вы хотите создать прослушиватель событий в componentDidMount и очистить его в componentDidUnmount. Как класс, основанный на перехватах, код будет объединен в одну функцию обратного вызова.

Для очистки определите вот так -example

useEffect(()=>{
        let interval = setInterval(()=>{
           // do something 
         }),1000}
    return () => { clearInterval(interval) }
}, [foo])

Для лучшего понимания проверьте официальный Эффекты с очисткой

...