Блог

В проекте, над которым я работаю, мы переносим все компоненты пользовательского интерфейса на StencilJS, чтобы они не зависели от фреймворка. Проблема, с которой я сталкиваюсь, заключается в том, что теперь я должен перенести модальный компонент, который у нас был в приложении react, в StencilJS, и позже этот компонент StencilJS будет использоваться приложением React.

Конечно, у модалов есть дочерние элементы, потому что у них есть содержимое. Я знаю, что вы можете отображать дочерние элементы с <slot /> в StencilJS, но что, если эти дочерние элементы являются компонентами React, поскольку приложение react использует модальный?

что-то вроде

 <Stencil-js-modal>
  <react-content-a/>
  <other-react-component/>
</Stencil-js-modal>
  

сработает ли это? В случае, если этого не произойдет, то как может быть достигнута такого рода интеграция между react и stencil?

Заранее спасибо.

Предполагается, что для отображения его содержимого <Stencil-js-modal> используется <slot> , что должно работать нормально.

Вам нужно убедиться, что вы используете shadow: true при определении модального; таким образом, React не пытается повредить внутренние компоненты компонента при его визуализации.