Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Modal (rc-dialog, rc-trigger) could provide interface like "isUseCreatePortal"

See original GitHub issue

I have searched the issues of this repository and believe that this is not a duplicate.

What problem does this feature solve?

as we know, React 16 add new api ReactDOM.createPortal , and the portal will propagation event to parent. for it’s name protal , this behavior maybe make sense, but it also takes many trouble(https://github.com/facebook/react/issues/11387)

I think the component named “Modal” should not share event with the parent. I find rc-dialog use IS_REACT_16 = !!ReactDOM.createPortal; to make compatible with React 16- . I think Modal could provide interface like isUseCreatePortal .

What does the proposed API look like?

<Modal isUseCreatePortal={true|false} />

Issue Analytics

State:
Created 5 years ago
Comments:6 (4 by maintainers)

Top GitHub Comments

1reaction

yesmeckcommented, Jun 8, 2018

Unfortunately, React will remove unstable_rendersubtreeintocontainer in the feature, so adding isUseCreatePortal is not a good choice. As a workaround you wrap DatePicker with a <span onClick={e => e.stopPropagation()}>

0reactions

swchencommented, Jun 8, 2018

It works. Maybe antd could buildin wrap it and provide a prop like isStopPropagation

Top Results From Across the Web

React: Using portals to make a modal popup

I'm going to take the relatively simple createPortal and add a layer of complexity and contain it within a component. Hopefully this will...

Using React Portals to build a modal - LogRocket Blog

Learn how to build a modal or overlay component in React with React Portals. Our demo is applicable for all top level components....

Create a custom modal in React with context, portals, and hooks

Let's start by creating a basic modal that conditionally renders depending on some local state. Clicking a button in the application root should ......

Portals - React

Portals provide a first-class way to render children into a DOM node that exists ... For modal dialogs, ensure that everyone can interact...

Bootstrap modal not displaying - Stack Overflow

I tracked down the reason. Just to give it some general usefulness to anyone coming to this question. If you can't figure out...