我们正在使用具有 ES6 语法的 WebComponents。
WebComponents polyfill webcomponents-lite.js(不包括 ShadowDOM)在 IE 11 中不工作,而 webcomponents.js(包括 ShadowDOM)工作正常。对于我们的项目用例,我们希望使用不带 ShadowDOM 的“自定义元素”。
如果我们使用 webcomponents-lite.js,IE 会抛出一个错误 - SCRIPT5022: Exception thrown and not caught.
是否有可用的解决方法?
编辑:我试图在 IE 中使用 webcomponents-lite.js 运行的代码
HTML:<super-button></super-button>
JS(ES6 格式):
class SuperBtn extends HTMLElement {
constructor() {
super();
}
createdCallback() {
this.innerHTML = "Invoke Ultron!";
this.addEventListener('click', () => alert(this.textContent + ' has been clicked'));
}
}
document.registerElement("super-button", SuperBtn);
最佳答案
是的,您可以使用原始 prototype
表示法声明自定义元素 v1。
这适用于 another polyfill来自 Web 反射:
var CEo = function ()
{
console.log( "created" )
return Reflect.construct( HTMLElement, [], CEo )
}
CEo.prototype = Object.create( HTMLElement.prototype )
CEo.prototype.constructor = CEo
CEo.prototype.connectedCallback = function ()
{
console.log( "connected" )
this.innerHTML = "Hello v1"
}
customElements.define( "object-v1", CEo )
注意:您需要使用类似 the one of Babel 的 polyfill获取 Reflect.construct
方法。
关于javascript - 带有 ES6 的 webcomponents-lite 在 IE 11 和 10 中不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39831336/