让Svelte在阴影dom内添加样式

问题描述

我的苗条应用程序应该在阴影元素内渲染。这可行，但是所有样式都添加到外部文档的头部。我曾尝试在shadow dom中创建HTML元素，但是样式仍添加到外部文档的开头。

有什么办法告诉svelte在哪里添加样式？在我的用例中，不能将样式保存在外部文件中。

图像显示的是外部头部的样式，而阴影根中则没有样式。

周围工作

作为一种变通办法，我知道将侦听器添加到文档头，然后将添加到影子根的内容移动。这在我的应用程序中有效，当时的应用程序中只有一个影子域，但这不是通用解决方案。

const outerHead = document.getElementsByTagName('head')[0]
const config = { attributes: false,childList: true,subtree: false }
const callback = function (mutationsList,observer) {
mutationsList.forEach(mutation => {
     mutation.addednodes.forEach(n => shadowHtml.getElementsByTagName('head')[0].appendChild(n))
     })
}
const headobserver = new MutationObserver(callback);
headobserver.observe(outerHead,config);

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）