StencilJs在新窗口中渲染组件

如何解决StencilJs在新窗口中渲染组件

我正在寻找如何使用window.open在新窗口中呈现由stenciljs创建的聊天小部件的方法。

单击窗口小部件图标时将打开新窗口，并且该窗口应保留在网站上导航时当前具有的任何状态。它也应该具有父级的样式和功能。

我了解使用React可以利用门户网站来实现这一目标。但是有人知道如何用stenciljs做到这一点吗？还是应该尝试将React与Stenciljs一起使用，看看它的去向？

模拟代码：

<Host class="chat">
 {this.state.open ? (
   <div class="chat-wrapper">
     <chat-header customparam={this.customparam} />
     <chat-content anotherparam={this.anotherparam} />
   </div> 
  ) : (
   <open-chat
     label={this.state.openChatLabel}
     onClick={this.openChat.bind(this)} />
   )}
</Host>

所以我想在新窗口中打开此部分：

<div class="chat-wrapper">
  <chat-header customparam={this.customparam} />
  <chat-content customparam={this.customparam} />
</div> 

我已经尝试写入新窗口并在其中附加标题和内容。但是可能有更好的方法可以做到这一点。如果您知道任何方法或想法，请分享。解决后将进行总结。

解决方法

编辑：问题已解决。整个组件已经包含在新窗口中，并且必须为其分配其他路径名，添加一种检查window.location.href的方法，然后更新组件状态。