据我所知,这是组件反应生命周期中的“阶段”:
安装:安装是渲染render方法本身返回的JSX的阶段。 更新:更新是更新组件状态并重新绘制应用程序的阶段。 卸载:顾名思义,“卸载”是组件生命周期中从页面上删除组件的最后一步。
安装->更新->卸载
我成功使用了它,但我不知道如何将这三个“阶段”与混合使用: -提交阶段 -预提交阶段 -渲染阶段
我发现了这个:http://projects.wojtekmaj.pl/react-lifecycle-methods-diagram/
我不确定“正在安装”,“正在更新”和“正在卸载”是阶段还是其他。阶段是否可能是:提交,预提交和渲染。 “安装,更新和卸载”是事件还是阶段?
有任何线索吗?
答案 0 :(得分:1)
“渲染阶段”和“提交阶段”是对内部过程的描述,这些内部过程通过反应来更新页面。尽管了解其中发生的情况可能很有用,但您可以与之交互的唯一地方是通过各种生命周期挂钩,例如componentDidMount,componentDidUpdate和componentWillUnmount,因此我建议您着重研究这些内容。
是时候渲染页面了(通常是由于在某个地方调用this.setState引起的),react经过一系列步骤来更新网页:
第一组步骤统称为“渲染阶段”。在渲染阶段,react正在创建虚拟DOM。换句话说,它可以确定页面的外观,而无需实际更改页面。以最简单的形式(其中我们不跳过诸如react.memo或shouldComponentUpdate之类的任何渲染),在最顶层的组件上进行react调用render,并找出返回的内容,然后为每个子组件调用在那些子组件上的render直到知道整个页面的样子。
第二组步骤称为“提交阶段”。既然知道了页面的外观,就需要更新 actual DOM以匹配虚拟DOM。为此,它将在渲染阶段获得的当前虚拟DOM与上次渲染得到的虚拟DOM进行比较,并计算出最少的更新集,以使页面看起来像这样。
现在,渲染已完成,页面已更新。在此过程中,有可能是第一次创建了某些组件(即“安装”),或者更改了道具(即“更新”),或者将它们完全删除了(“卸载”)。发生这种情况的组件将根据需要调用其componentDidMount,componentDidUpdate和componentWillMount函数。
答案 1 :(得分:0)
渲染阶段:用于计算变化,如果用户愿意,可以中止。如果此阶段中止,则 DOM 不会更新。
预提交阶段:您可以在对 VDOM 所做的更改应用到实际 DOM 之前读取这些更改的时间段。
提交阶段:在这里应用更改并触发任何副作用。
安装:在创建组件时运行一次。 更新:每次对组件进行更改时运行。 Unmounting:在组件即将销毁时运行一次。