相关疑难解决方法(0)

我正在努力做最后一年的反应.我们遵循的约定是componentDidMount在数据到来之后进行API调用,获取数据和setState.这将确保组件已安装,并且设置状态将导致重新呈现组件但我想知道为什么我们不能setState componentWillMount或constructor

官方文件说:

在安装发生之前立即调用componentWillMount().它在render()之前调用,因此在此方法中设置状态不会触发重新呈现.避免在此方法中引入任何副作用或订阅.

它说setting state in this method will not trigger a re-rendering,在进行API调用时我不想要它.如果我能够获取数据并且能够设置状态(假设API调用真的很快)in componentWillMount或in constructor并且数据存在于第一个渲染中,为什么我要重新渲染呢？

如果API调用很慢,那么setState将是异步并且componentWillMount已经返回然后我将能够setState并且应该发生重新渲染.

总的来说,我很困惑为什么我们不应该在构造函数或componentWillMount中进行API调用.在这种情况下,有人能真正帮助我理解反应是如何起作用的吗？

tldr; version:父类在setState调用后没有重新渲染...

我有一个仪表板视图,呈现多个组件.加载数据的子组件工作得很好.但我有仪表板的另一部分,我计划使用相同的数据集加载同一组件的多个版本.因此,我不是对同一个数据集进行6次api调用,而是通过父级将数据拉入并将其发送给子级.此外,我正在使用路由参数来指示要查找的公司.

包含自己的api调用的组件工作得很好,与路径参数一起正常运行.这是我在父母那里进行api调用的组件,我遇到了问题.父级正在渲染,然后是子级,然后api调用完成并设置状态,但不重新加载.因此,当路径参数发生变化时,组件会显示前一次点击的数据(基本上总是落后一个).

我已经尝试更改哪些反应事件将它绑定到,我使用映射函数,确保"this"是我想要的"this"(它是)...没有骰子.我知道它正在正确地更新状态,如果我在forceUpdate()中显示正确的数据(但我不能这样做,它会强制我将forceUpdate()添加到react更新方法中,这将导致它不断重新加载).

有任何想法吗？？这是一些精简/混淆的代码:

亲

...
class ClientDash extends Component {
    constructor(props) {
        super(props);
        this.state = { chartOptions: {}, data1: {}, data2: {}, data3: {}, data4: {}, data5: {}, data6: {}, loaded: false };
    }

    loadData(clientID) {
        var currYear = moment().year();
        var chartData = {
            labels: [(currYear-4).toString(), (currYear-3).toString(), (currYear-2).toString(), (currYear-1).toString(), currYear.toString()],
            datasets: [{
                type: 'bar',
                label: 'Cat1',
                backgroundColor: this.props.colors[0].borderColor,
                borderColor: 'white',
                borderWidth: 3,
                data: [null, null, null, null, null]
            }, {
                type: 'bar',
                label: 'Cat2',
                backgroundColor: this.props.colors[1].borderColor,
                borderColor: …