javascript - 如何在第一次加载页面之前调用react中的操作？

Question

我在 componentDidMount 中有一个通过点击调用的操作

onBtnClick = (data: any) => {
  this.props.componentDidMount(data);
};

<button onClick={this.onBtnClick}> Toogle posts </button>;
{
  this.props.data.map((el: any) => <li key={el.id}>{el.title}</li>);
}

如何在第一个页面加载之前调用 componentDidMount？不使用onClick函数

Answer 1

componentDidMount是React中的一个生命周期方法，在组件成功渲染后调用。您不应将此属性传递给任何其他组件。

如果您希望在页面完全加载之前(调用 componentDidMount 之前)调用函数或操作，则需要使用 UNSAFE_componentWillMount()，该函数已被弃用，我建议您不要使用用它。或者您可以直接在 constructor() 方法中调用该操作。构造函数是第一个被调用的东西。

要知道的另一件重要的事情是，您不应该从 onClick() 函数调用生命周期方法，它们由 React 本身进行适当的处​​理和调用。

如果您需要将组件作为 Prop 传递。创建一个名为 myCustomComponentDidMount() 的函数，而不是 componentDidMount()，然后从 constructor() 调用它，这是在第一次加载之前应用程序的，然后您还可以将该函数作为 prop 传递给其他人，而不会与 componentDidMount()

冲突