React ES6組件不會重新發送

Question

我有以下代碼。 請注意兩個console.log 。 我從<ChartTitle>組件的另一個子_getChartData()調用_getChartData()函數。

問題是當第二次調用_getChartData()時，它不會重新呈現下面代碼的子組件。 我期待它這樣做，因為那里有setState 。

export default class PerformanceChart extends React.Component {

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

    componentDidMount() {
        this._getChartData();
    }

    _getChartData(d = 30) {

        console.log('running setState for chart data');

        // AJAX GOES HERE
        this.setState = ({
            chart_data : [ 
                ['x', '2016-01-01', '2016-03-01', '2016-04-01', '2016-05-01', '2016-06-01', '2016-07-01', '2016-08-01'],
                ['Clicks', Math.random(), 200, 100, 400, 150, 250, 125, 600],
                ['Orders Reported', 300, 250, 100, 400, 150, 250, 40, 300],
                ['totals', [1050, 5042]]
            ]
        });

    };

    render() {

        console.log('re-rendering!');

        return (

            <div>
                <ChartTitle chart_data={this.state.chart_data} getChartData={this._getChartData.bind(this)} />
                <Chart chart_data={this.state.chart_data} />
            </div>

        );
    }

};

這是我在我的控制台中得到的：

Answer 1

我想這是你的問題

this.setState = ({

setState是一個函數，你需要調用它而不是賦值它，即：

this.setState({
    chart_data : [ 
        ['x', '2016-01-01', '2016-03-01', '2016-04-01', '2016-05-01', '2016-06-01', '2016-07-01', '2016-08-01'],
        ['Clicks', Math.random(), 200, 100, 400, 150, 250, 125, 600],
        ['Orders Reported', 300, 250, 100, 400, 150, 250, 40, 300],
        ['totals', [1050, 5042]]
    ]
});