Question

这是一个正在发生的事情的日志，当我在我的应用程序中导航时，父组件第二次挂载但从未卸载过。这会导致问题，因为我在这些函数中改变了redux状态：

2016-12-12 14:06:01.160 events.js:33  EVENTS componentWillMount
2016-12-12 14:06:01.257 events.js:38  EVENTS componentWillReceiveProps
2016-12-12 14:06:01.534 events.js:38  EVENTS componentWillReceiveProps
2016-12-12 14:06:01.537 forms.js:34   FORMS componentWillMount
2016-12-12 14:06:01.537 forms.js:20   FETCHING!!!!!
2016-12-12 14:06:01.541 forms.js:52   render
2016-12-12 14:06:01.591 forms.js:39   FORMS componentWillReceiveProps
2016-12-12 14:06:01.592 forms.js:52   render
2016-12-12 14:06:01.771 forms.js:39   FORMS componentWillReceiveProps
2016-12-12 14:06:01.774 layout.js:29  EVENTAPP componentWillMount
2016-12-12 14:06:01.806 forms.js:34   FORMS componentWillMount

因此它会触发“unmount”并尝试渲染哪个不起作用，因为我的状态假设现在卸载了容器。您可以看到它第二次安装 AFTER 其子项已挂载？

这是路由器/组件树的结构：

<Route component={FormsContainer}>
    <Route component={EventAppLayout}>
        <Route path="dashboard" component={Dashboard} />
        <Route path="reports" component={ReportsContainer}>
            <IndexRoute component={Reports}/>
            <Route path=":reportId" component={RunReportContainer} />
            <Route path=":reportId/:subReportId" component={RunReportContainer} />
        </Route>
        <Route path="attendees" component={AttendeesContainer}>
            <IndexRoute component={Attendees} />
            <Route path=":attendeeId" component={AttendeesNav}>
                <Route path="overview" component={AttendeeDetails} />
                <Route path="answers" component={AttendeeAnswers}/>
            </Route>
        </Route>
    </Route>
</Route>

FormsContainer是正在挂载/卸载的那个。我希望它在ReportsContainer和AttendeesContainer之间转换时永远不会卸载/挂载，因为它是两者的父容器？

所以我的问题是：

为什么父容器完全卸载/重新安装？
为什么在没有先卸载的情况下再次挂载？
我该如何解决这个问题？

react-router组件状态函数没有按顺序触发？

0 个答案: