我想写的类,将创建一个html节点和一切工作正常,但当我导入到文件中,我正在创建这个类的对象,并将这个对象导出到另一个js文件,然后它不会加载(整个文件中,我导入这个创建的对象)
类文件
export default class Component {
constructor(type, className, codeIn) {
this.codeIn = codeIn;
this.className = className;
this.type = type;
}
get htmlComponent() {
return this.codeConv();
}
codeConv() {
const temp = document.createElement(`${this.type}`);
temp.classList.add(`${this.className}`);
temp.innerHTML = `${this.codeIn}`;
return temp;
}
}
正在创建对象
import Component from "../../js/core/component";
const docker = {
article: new Component(
"article",
"article",
'...'),
ft: new Component("ft", "ft", `<li>Useful commands</li>`),
};
export { docker };
无法加载的文件
import { docker } from "../pages/docker/docker.js";
import Component from "./core/component.js";
document
.querySelector(".inside")
.insertBefore(docker.article.htmlComponent, document.querySelector(".ftWr"));
...
1条答案
按热度按时间yruzcnhs1#
我认为你使用
.insertBefore()
的方式有问题,我把代码改成了这样,现在它看起来可以工作了,至少对我来说...**编辑:**Nwm,我尝试用liveServer而不是通过comandline运行它,并得到了一个导入错误。对我来说,解决这个问题的方法是在脚本标签中添加
type="module"
,如下所示:因为如果你不告诉浏览器,浏览器会假设普通的js导入