[英]How to stop re-rendering of child component when its parent's props change?
I have a Modal
that is a child of a Card
component:我有一个
Modal
是Card
组件的子组件:
Card > Modal
The Card
has props that it sends down to the Modal
. Card
有它发送到Modal
的道具。 When I select an option in the Modal
's UI, it updates the data in the Card
and, thus, re-renders the Card
, closing the Modal
as it does so.当我 select
Modal
的 UI 中的一个选项时,它会更新Card
中的数据,从而重新呈现Card
,同时关闭Modal
。
This is not ideal because I would like the user to continue to use the Modal
until they explicitly hit "close".这并不理想,因为我希望用户继续使用
Modal
,直到他们明确点击“关闭”。
Is there a way to update the data/state in the underlying Card
(so that the Modal
can use the new state), but NOT trigger a full re-render of the component tree until the Modal
is finally closed?有没有办法更新底层
Card
中的数据/状态(以便Modal
可以使用新状态),但在Modal
最终关闭之前不会触发组件树的完全重新渲染?
There is no Redux involved right now, and I'd like to avoid it if possible.现在没有涉及 Redux,如果可能的话我想避免它。
Whenever a state is updated, all components that use the state and its children are re-rendered.每当 state 更新时,所有使用 state 及其子组件的组件都会重新呈现。 You should probably use react portals to achieve what you need with the modal.
您可能应该使用反应门户来实现您对模态的需求。 There is a fiddle on the end of the docs link.
文档链接的末尾有一个小提琴。 Docs: https://reactjs.org/docs/portals.html
文档: https://reactjs.org/docs/portals.html
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.