Блог

Главная - Вопросы по программированию - Как вызвать метод в render вместо componentDidUpdate?

Как вызвать метод в render вместо componentDidUpdate?

#reactjs

#reactjs

Вопрос:

Я хочу избежать жизненного цикла componentDidUpdate и хочу вызвать метод в render. Поскольку я не загружаю данные в этот компонент, я хочу избавиться от componentDidUpdate.

Ниже приведен код,

 export default class child extends React.Component {
    state = {
        query: '',
        data: null,
    };
    empty_id = 0xffffffff;

    componentDidMount() {
        this.set_open_data();
    }

    componentDidUpdate(prevProps) {
       if (prevProps.id !== this.props.id) {
            this.set_data();
       }
    }

    set_data = () => {
        if (!this.props.info) {
            return;
        }
        if (this.props.id === this.empty_id) {
            this.setState({data: null});
            return;
        }

        let data = {
            info: [],
            values: [],
        };
        const info = this.props.info;
        for (let i=0, ii=info.length; i < ii; i  ) {
            if (info[i].meshes.includes(this.props.id)) {
                const info = info[i].info;
                const values = info[i].values;
                data = {
                    info: typeof info === 'string' ? info.split('rn') : [],
                    values: values ? values : [],
                };
                break;
            }
        }
        this.setState({data: this.filter_data(data, this.state.query)});
      };
      render = () => {
          /* i want to call set_data here but should not sure of when to be 
         called meaning condition like in componentdidupdate method*/
         this.set_data();};}

Может ли кто-нибудь помочь мне решить это? Спасибо.

Комментарии:

1. Я хотел бы отметить, что если вы установите состояние внутри функции render (или внутри componentDidUpdate ), ваш компонент будет повторно отображаться, потому что вы вызвали setState . Это, в свою очередь, снова вызывает функцию render, которая вызывает setState снова, оставляя вас с бесконечным циклом рендеринга. Почему вы хотите повторно установить данные во время функции render или после обновления.

2. Вы должны объяснить, чего вы хотите достичь.. В любом случае, @ApplePearPerson совершенно прав, но при использовании setState() в componentDidUpdate() это нормально: вам просто нужно поместить setState() в условие (которое, конечно, не должно выполняться всегда, иначе вы попадаете в бесконечный цикл).

3. @Matteo Gesmundo как я могу переписать метод set_data таким образом, чтобы он не использовал setState для данных, чтобы использовать этот метод set_data в методе render? Спасибо.

4. @stackoverflow_user Честно говоря, я не понял вашего вопроса >_> Позвольте мне сказать это (возможно, это может вам помочь): внутри render() нормально вызывать функцию, которая вроде как собирает данные, начиная с текущего состояния. Вместо этого, если вам нужно изменить состояние компонента, если текущее состояние удовлетворяет какому-либо условию, вам нужно использовать setState() внутри componentDidUpdate() метода