Question

当组件在dom中准备就绪时，webcomponent-loader.js无法调度该事件。 document.dispatchEvent（new CustomEvent（'WebComponentsReady'，{bubbles：true}））; 我正在尝试创建 wysiwyg-e 组件，并且在dom准备就绪时不会让组件加载。由于addEventListner，它停止服务整个聚合物应用程序。

错误::未捕获TypeError：无法读取属性'addEventListener'为null

<dom-module id="custom-keybar">
     <template>
     <wysiwyg-e style="width: 100vw; height: 100vh;" id="wysiwygE">
        <wysiwyg-tool-bold></wysiwyg-tool-bold>
        <wysiwyg-tool-italic></wysiwyg-tool-italic>
        <wysiwyg-tool-underline></wysiwyg-tool-underline>
        <wysiwyg-tool-strike></wysiwyg-tool-strike>
        <wysiwyg-tool-color></wysiwyg-tool-color>
        <wysiwyg-tool-clear></wysiwyg-tool-clear>
        <wysiwyg-tool-code></wysiwyg-tool-code>
        <wysiwyg-tool-link></wysiwyg-tool-link>
        <wysiwyg-tool-image></wysiwyg-tool-image>
        <wysiwyg-tool-audio></wysiwyg-tool-audio>
        <wysiwyg-tool-video></wysiwyg-tool-video>
        <wysiwyg-tool-ordered></wysiwyg-tool-ordered>
        <wysiwyg-tool-unordered></wysiwyg-tool-unordered>
        <wysiwyg-tool-indent></wysiwyg-tool-indent>
        <wysiwyg-tool-outdent></wysiwyg-tool-outdent>
        <wysiwyg-tool-justify right center full></wysiwyg-tool-justify>
        <wysiwyg-tool-heading h1 h2 h3 h4 h5 h6></wysiwyg-tool-heading>
        <wysiwyg-tool-blockquote></wysiwyg-tool-blockquote>
    </wysiwyg-e>
    <iron-ajax url="../README.md" handle-as="text" id="ajax"></iron-ajax>
     </template>

     <script>
     window.addEventListener(
             'WebComponentsReady',
               function () {
                var ironAjax = document.querySelector('iron-ajax'), wysiwygE 
       = document.querySelector('wysiwyg-e');

                ironAjax.addEventListener(
                    'response',
                    function () {
                        var value = marked(this.lastResponse);
                        wysiwygE.value = value.replace(new 
         RegExp('https://miztroh.github.io/bower_components/wysiwyg-e/', 
                 'g'), '../');
                    }
                );

                ironAjax.generateRequest();
            // };
        // );
         </script>
       </dom-module>

Answer 1

你可以试试更多的Polymer，并重写你的<iron-ajax>和<script>标签吗？ e.g。

<iron-ajax url="../README.md" handle-as="text"
    auto on-response="handleResponse"></iron-ajax>

<script>
    class KeyBar extends Polymer.Element {
        handleResponse(event, request) {
            var value = marked(event.detail.response);
            // ...
        }
    }
    customElements.define('custom-keybar', KeyBar);
</script>

无法在聚合物2.0中读取eventlistner的属性

1 个答案: