javascript - react 。无法在 getDerivedStateFromProps 内启动函数

我无法理解，为什么当我尝试在 getTodosList 方法中启动函数 getDerivedStateFromProps 时 - 它总是向我返回 TypeError - Cannot read property 'getTodosList' of null 。

同样在我开始使用 getDerivedStateFromProps 之后 - 我的函数也没有在 componentDidMount 中启动......

我做错了什么？ (

import React, { Component } from 'react';
import {Doughnut} from 'react-chartjs-2';

class Chart extends Component {
    constructor(props) {
        super(props);

        this.state = {
            // some state...
    }

    getTodosList = (todos) => {
        console.log(todos);
        const all = [];
        const done = [];

        // some logic...

    }

    componentDidMount() {
        const { todos } = this.props.state.iteams;
        console.log('componentDidMount', todos);

        this.getTodosList(todos);
    }

    static getDerivedStateFromProps(nextProps, prevState) {
        const { todos } = nextProps.state.iteams;
        console.log(this.getTodosList, prevState.datasets, 'componentWillReceiveProps', todos);

        this.getTodosList(todos); // TypeError: Cannot read property 'getTodosList' of null

    }

最佳答案

getDerivedStateFromProps 是类的静态属性(如前面的 static 关键字所示)。这意味着它无权访问任何实例函数/属性。

将您的 getTodosList 也声明为静态(如果它也不使用任何实例属性)，然后调用 Chart.getTodosList(todos) 。

编辑 :
如果您在 setState 中调用 getTodosList ，您可以将其更改为返回状态对象，然后您可以根据调用函数返回的对象构造/更新您的状态。

例如。

static getTodosList = todos => {
  ...
  return { someState: someData }; //instead of this.setState({ someState });
}
static getDerivedStateFromProps() {
  ...
  return Chart.getTodosList(todos);
}

如果 componentDidMount 与 getDerivedStateFromProps 做同样的事情，你也不需要它。

关于javascript - react 。无法在 getDerivedStateFromProps 内启动函数，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/50056137/