this.setState не является функцией, ошибка сохраняется, хотя я следил за множеством примеров, в которых используется один и тот же код.

Question

Я новичок в React и пытаюсь заполнить состояние моих компонентов данными, хранящимися в моей базе данных mongodb.

Я использую этот вызов для получения данных:

class DisplayPrograms extends Component {
  constructor(props) {
    super(props);
    this.setState = { programs: [] };
  }

  componentDidMount() {
    axios
      .get("http://localhost:5000/programs")
      .then((response) => {
        console.log(response.data);
        this.setState({ programs: response.data });
      })
      .catch(function (error) {
        console.log(error);
      });
  }

render() { .....

Моя функция render () (не входит в комплект) работает, а мой console.log (response.data) выводит массив объектов, как и положено, как вы можете видеть ниже, но я продолжаю получать следующую ошибку:

Array [ {…}, {…} ]
DisplayProducts.jsx:15
_________________________________________________

TypeError: "this.setState is not a function"
    componentDidMount DisplayProducts.jsx:16
DisplayProducts.jsx:19

Я уверен, что это быстрое решение, но мне не удалось найти решение.

Answer 1

Ваш конструктор должен выглядеть так:

  constructor(props) {
    super(props);
    this.state = { programs: [] };
  }

Вы использовали this.setState() в конструкторе вместо this.state Здесь - это документы, которые показывают синтаксис.

Answer 2

В constructor вам нужно создать начальное состояние, поэтому вам понадобится что-то вроде:

constructor(props) {
  super(props);
  this.state = {
    programs: []
  }
}

Функция this.setState, которую вы можете использовать где угодно.