如何在另一个函数中使用 .then 中的 setState 作为 ReactJS 中的参数

Question

我是 ReactJS 的新手。我有：

this.service
        .getData({})
        .then((response: any) => {
            this.setState({
                id: response.id
            });
        })

getStats(this.state.id) {
...
}

我无法在 .then 之外获取 id 的值。我想在多个函数中使用 id。如何获取 state 中的值，以便我不必多次调用该函数？请提出建议。

Answer 1

状态更新后，会再次调用render方法。在下一次渲染调用中，您将更新状态。 对 setState 的调用是异步的 - 不要依赖 this.state 在调用 setState 后立即反映新值。

所以为了使用状态设置后的状态，要么使用一些效果，要么使用组件生命周期来获取更新后的状态。

Answer 2

在类基础组件上，考虑到状态更新的异步性质，您更经常使用 componentDidUpdate 生命周期。此生命周期提供 prevProps, prevState, snapshot 作为参数，这有助于您在触发操作之前对当前状态进行一些验证。

fwiw, this.setState 也可以接收函数作为第二个参数。该函数将在 state 更新后执行，使您能够访问最新状态。