Polymer和WebComponentsReady事件

bit*_*shr 17 html javascript web-component polymer

根据Polymer docs,WebComponentsReady事件是必要的,因为......

polyfills解析元素定义并异步处理它们的升级.如果您在有机会升级之前过早地从DOM中获取元素,那么您将使用HTMLUnknownElement.在这些情况下,请在与元素交互之前等待WebComponentsReady事件

我有一个HTML页面,它导入一个Web组件并注册一个处理程序,该处理程序在加载所有Web组件时记录语句:

<!DOCTYPE html>
<html>
    <head>
        <script src="bower_components/platform/platform.js"></script>
        <link rel="import" href="elements/my-element.html">
    </head>
    <body unresolved>
        <my-element></my-element>
        <script>
            window.addEventListener('WebComponentsReady', function(e) {
                console.log('components ready');
            });
        </script>
    </body>
</html>
Run Code Online (Sandbox Code Playgroud)

为什么WebComponentsReady事件在my-element的ready聚合物事件之前触发?我需要知道何时可以与自定义元素进行交互,例如更改其属性并调用其公共方法.

小智 23

在Polymer 1.0中你可以听WebComponentsReady.

在Polymer 0.5中,因为它以异步方式执行更多操作,所以polymer-ready会在加载元素时触发一个额外的事件.这是一个显示订单的jsbin.

  • 现在只引发WebComponentsReady. (4认同)
  • 为了补充@Nikolay提到的内容,Polymer 1.0 [删除了'聚合物就绪'事件](https://www.polymer-project.org/1.0/docs/migration.html#polymer-ready),现在你只是需要听"WebComponentsReady" (2认同)