Почему мы должны избегать побочных эффектов в конструкторах компонентов? - PullRequest
Новая
       83

Почему мы должны избегать побочных эффектов в конструкторах компонентов?

0 голосов
/ 04 апреля 2020

Интересно, есть ли веская причина не отправлять запросы в конструкторе компонента, а не в его componentDidMount ловушке? Я видел интересных (но немного неполных) ответов для: это хорошая идея для извлечения данных в конструкторе? ответ цитирует интересный бит из документации:

Избегайте каких-либо побочных эффектов или подписок в конструкторе. Для этих случаев используйте вместо этого componentDidMount ().

Мой вопрос по этому вопросу, мне любопытно понять, в чем проблема с побочными эффектами , как, например, здесь при отправке запроса в конструкторе.

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

Отправка запроса в конструкторе 

class SomeComponent extends React.Component {
    constructor(props) {
        this.request = fetch(props.someURL);
    }

    async componentDidMount() {
        const data = await this.request;
        this.setState({'data': data});
    }
}

Или отправка в componentDidMount

class SomeComponent extends React.Component {
    async componentDidMount() {
        const data = await fetch(props.someURL);;
        this.setState({'data': data});
    }
}

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

class SomeComponent extends React.Component {
    constructor(props) {
        this.data = await fetch(props.someURL);
    }

    async componentDidMount() {
        this.setState({'data': this.data});
    }
}
...