Phi*_*aro 7 html javascript dart angular-dart
在 vanilla JS 中可以通过以下方式创建 Web 组件:
\nextends
HTMLElement
window.customElements.define(\'app-drawer\', AppDrawer);\n
Run Code Online (Sandbox Code Playgroud)\n由于我在 Dart 中有很多代码,我想我可以用它来做到这一点。但我遇到了一些障碍。主要是已被弃用且似乎不起作用的事实document.registerElement()
window.customElements.define()
。
\n\nI mostly use Microsoft Edge as a browser. But it uses Chromium anyway. And I\'ve also tested everything mentioned below on Chrome as well.
\n
document.registerElement()
G\xc3\xbcnter\'s answer points to this dartpad, which uses the document.registerElement()
to define it.
His answer does work, but document.registerElement()
is deprecated:
document.registerElement is deprecated and will be removed in M80, around February 2020. Please use window.customElements.define instead.\n
Run Code Online (Sandbox Code Playgroud)\nOr at least on my computer it works, because his DartPad actually gives back the error of NoSuchMethodError: method not found: \'registerElement\'
window.customElements.define()
\n\n\n
\n\n\n
document.registerElement is deprecated and will be removed in M80, around February 2020. Please use window.customElements.define instead.\n
Run Code Online (Sandbox Code Playgroud)\nThe code above will yield the following error message:
\nError: Failed to execute \'define\' on \'CustomElementRegistry\': The callback provided as parameter 2 is not a function.\n
Run Code Online (Sandbox Code Playgroud)\nI\'ve even tried to create an interop function for JS\'s window.customElements.define
, but the error was the same.
import \'dart:html\';\n\nmain() {\n try {\n window.customElements.define(\'graph-button\', GraphButton);\n final GraphButton button = GraphButton();\n document.body.append(button);\n button.changeInnerHtml();\n } catch (e) {}\n}\n\nclass GraphButton extends HtmlElement {\n static const String tag = \'graph-button\';\n\n factory GraphButton() => Element.tag(GraphButton.tag);\n\n GraphButton.created() : super.created();\n\n changeInnerHtml() => innerHtml = \'foo\';\n}\n
Run Code Online (Sandbox Code Playgroud)\nThen simply replacing the registering above for registerWebComponent(GraphButton.tag, GraphButton);
will now yield the same error message.
Is there official documentation on this topic? I was hoping to find something about it on AngularDart\'s docs \xe2\x80\x94 since, in Angular, creating web components is quite common \xe2\x80\x94, but I haven\'t been able to so far.
\n\n 归档时间: |
|
查看次数: |
1677 次 |
最近记录: |