렌더가 그림자 루트에 반응합니다.

Question

섀도우 루트의 React 구성 요소를 캡슐화하려고합니다.. 구성 요소가 문제없이 렌더링되지만 이벤트가 작동하지 않습니다.. 내 코드는 다음과 같습니다.

let shadow = document.getElementById('root').attachShadow({mode: 'open'}); 
shadow.innerHTML = "<div id='panel'></div>"; 


ReactDOM.render(
    <Admin />, 
    shadow.getElementById('panel') 
); 

React 버전은 15.4.2입니다. 나는 이슈 목록을 살펴 보았는데 이것이 문제인지 아니면 내가 뭔가 잘못하고 있는지 이해할 수 없다.

도움이 될 것입니다!

Answer 1

이것은 알려진 문제입니다. 글로벌 이벤트 핸들러가 반응하는 문제가

:

논의가 있습니다

(here, here, here, 그리고 here)이 문제를 참조, 아래 그들 중 하나에서 발췌 한 것입니다 문서 에서 그림자 DOM은 호스트 노드의 처럼 보이도록 이벤트를 다시 지정합니다. 그러면 React가 이벤트를 오른쪽 요소 인 으로 전달하지 못하게됩니다.