在组件渲染前确保初始化完成

当组件接收到更新的props时，需要在渲染自身数据之前进行初始化操作。为确保此操作在渲染前完成，可以使用以下生命周期方法：

对于简单场景：

无需任何复杂操作，可以直接在组件函数中声明初始化变量。例如，以下代码：

const updateddata = props.data + '_updated';

可以在组件函数的开头直接赋值。

对于依赖props.data存在大数据量计算的场景：

可以使用usememo钩子函数，让此计算逻辑只在props改变时执行。例如：

const updateddata = usememo(() => {
  return props.data + '_updated';
}, [props.data]);

对于使用状态（state）控制新值并依赖props.data改变的场景：

可以使用usestate钩子和useeffect生命周期，在props更新时更新状态，并使用状态值作为渲染数据。例如：

const [updatedData, setUpdatedData] = useState(() => {
  // 做一些初始化操作
  return props.data + '_updated';
});

useEffect(() => {
  setUpdatedData(props.data + '_updated');
}, [props.data]);