@sharkdest

Как навязать двустороннюю связь между компонентами в ReactJS?

Есть класс и функция:

import React from 'react';

export default class ResultsContainer extends React.Component {

  constructor(props) {
    super(props);

    this.state = {
      //хочу получить в state ответ с myFunction
      response: ''
    };
  }

  componentDidMount = () => {
    const a=1;
    myFunction(a);
  }

  render() {
    return (
      <div>
      ...
      </div>
    )
  }
}


const myFunction = (props) => {
  const {a} = props;
  const response = a++
    return (
      response
    )
}


Как передать переменную с класса в функцию а потом передать ответ с функции в state класса?
  • Вопрос задан
  • 249 просмотров
Решения вопроса 1
rockon404
@rockon404 Куратор тега React
Frontend Developer
1. Объявлять componentDidMount стрелочной функцией - маразм. В этом нет никакого смысла.

2. Если ваша функция выполняется синхронно достаточно сократить до:
const response = myFunction(1);
this.setState({ response });


3. Если асинхронно:
componentDidMount() {
  const { someValue } = this.props;
  // асинхронный вызов, возвращающий Promise
  fetchSomeData(someValue).then(response => this.setState({ response }));
}

или:
async componentDidMount() {
  const { someValue } = this.props;
  // асинхронный вызов, возвращающий Promise
  const response = await fetchSomeData(someValue);

  this.setState({ response }));
}


4. Сама функция myFunction написана очень плохо содержит ошибку. Лучше:
const myFunction = num => ++num;
Ответ написан
Пригласить эксперта
Ответы на вопрос 1
alexey-m-ukolov
@alexey-m-ukolov Куратор тега React
componentDidMount = () => {
    const a=1;
    this.setState({response: myFunction(a)});
}


Если функция асинхронная:
async componentDidMount = () => {
    const a=1;
    this.setState({response: await myFunction(a)});
}
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы