在 React 中，如何在渲染之前访问道具（不使用 componentWillReceiveProps）答案

【问题标题】：In React how can I get access to the props before rendering (without using componentWillReceiveProps)在 React 中，如何在渲染之前访问道具（不使用 componentWillReceiveProps）
【发布时间】：2020-11-26 11:45:09
【问题描述】：

我有一个基于从属性转换的数据呈现的组件。具体来说，该组件的属性之一是直接 JSON。然后该 JSON 由组件转换为渲染中使用的实际数据。

所以这是我不明白的一点。如果我更新了我的道具，那么在我有机会转换为数据进行渲染之前，渲染函数就会被调用。我发现 componentWillReceiveProps 功能完美，我可以在渲染之前准备好我的数据。

但是我看到现在已弃用此方法，并且其他建议似乎在它们自己的方式上存在缺陷（在渲染后调用，或者在安装时不调用等）

我不认为我的用例看起来特别独特，或者也许看到我对 React 的了解我误解了 props 的用法，但如果不是，那么为什么这似乎不受支持？

我必须使用哪些选项来使用新数据更新我的组件并在渲染发生之前转换该数据？

为了清楚起见，这就是我正在做的事情。 props.data 是组件在渲染之前理想地转换的属性。

    let props: IComponentProps = {
        data: context.parameters.json.raw != null ? JSON.parse(context.parameters.json.raw) : undefined,
        node:  context.parameters.node.raw || undefined,
        callback: (x) => console.log(`Got a callback on ${x}`)};

    ReactDOM.render(<FluentUIDetailsListControl {...props} />, container);

【问题讨论】：

标签： reactjs

【解决方案1】：

使用

static getDerivedStateFromProps(props, state) {
}

此函数在创建周期中在渲染函数之前触发，每次更新后首先触发。

props 变量是传入的 props。

主要是你使用道具来设置状态。

【讨论】：