useEffect (): Как выполнить рефакторинг componentetDidUpdate? - PullRequest
Новая
       8

useEffect (): Как выполнить рефакторинг componentetDidUpdate?

0 голосов
/ 03 мая 2019

Итак, я определил состояние: 

const [quantity, setQuantity] = useState(1);

, который в моем компоненте класса я обновил следующим образом: 

    componentDidUpdate(prevProps, prevState) {
        if (this.props.cartItem.quantity !== prevProps.cartItem.quantity) {
            let quantity = this.props.cartItem.quantity;
            this.setState((state, props) => {
                return {
                    quantity
                }}
            );
        }
    }

    componentDidMount() {
        this.setState((state, props) => {
            return {
                quantity: props.cartItem.quantity
            }}
        );       
    }

Аспект componentDidMount, которого я достигаю, выполняя: 

    useEffect(() => {
      setQuantity(parseInt(props.cartItem.quantity));
    });

Как добиться той же функциональности componentDidUpdate (), используя useEffect()?

1 Ответ

1 голос
/ 03 мая 2019

Вы можете просто добавить «зависимость» в свой хук useEffect. 

const { cartItem } = props;

useEffect(() => {
  setQuantity(parseInt(cartItem.quantity));
}, [cartItem]);

Это означает, что всякий раз, когда изменяется пропеллер cartItem, он вызывает обновление вашего состояния, в том числе при монтировании компонента.

...