【问题标题】:Polymer catch all events from child element聚合物从子元素中捕获所有事件
【发布时间】:2015-11-13 12:26:12
【问题描述】:

我目前正在努力使延迟加载和 Polymer 中的“更多路由”成为可能。我已经获得了延迟加载的第一个工作实现(受不幸的是不完全支持 Polymer 1.0 的 app-router 启发),但我不知道如何将所有事件从导入的子元素传递到我的延迟加载元素。

因此,在我的示例中,我希望事件“hi”从 page-login 传递到lazy-loader,并从lazy-loader 向上传递到包含lazy-loader 的元素——但不知道lazy-loader 中的特定事件.所以我需要类似“捕获子元素触发的所有事件”之类的东西。

这就是我所拥有的:

页面登录:

ready:function() {
                this.fire("hi");
            },

使用惰性加载器:

<lazy-loader on-hi="hi" href="../pages/page-login.html" id="login" route="login"></lazy-loader>

调用负载:

document.getElementById("login").load()

懒加载器(精简版):

<dom-module id="lazy-loader">
<template>
    <span id="content">Loading...</span>
</template>
<script>
    window.lazyLoaded = window.lazyLoaded || [];
    Polymer({
        is: "lazy-loader",
        properties: {
            href:{
                type:String,
                value:""
            },
            element:{
                type:String,
                value:""
            }
        },
        load:function(finishFunc) {
            if(window.lazyLoaded.indexOf(this.href)===-1) {
                var that = this;
                this.importHref(this.href, function(e) {
                    window.lazyLoaded.push(that.href);
                    if(!that.element) {
                        that.element = that.href.split('/').reverse()[0];
                        that.element = that.element.split(".")[0];
                    }
                    var customElement = document.createElement(that.element);

// here I need something like "customElement.on("anyEvent")" 
// => that.fire("anyEvent")

                    Polymer.dom(that.$.content).innerHTML = "Loading done.";
                    Polymer.dom(that.$.content).appendChild(customElement);
                    Polymer.dom.flush();
                    that.fire("loaded");
                });
            }
        }
    });
</script>

【问题讨论】:

  • 作为一个侧节点:我目前正在考虑扫描以“on-”开头的惰性加载器的属性,并为此事件添加“pass-through-listeners”。我仍然对更通用的方式持开放态度(不解析属性)。

标签: events polymer


【解决方案1】:

似乎我必须撤销我的问题 - 如果我在附加处理程序中触发事件,而不是准备好,它会自动通过 - 至少在当前版本的 Polymer 中。不确定这是否是预期行为,但现在问题已解决。答案仍然很有趣,也许对于其他情况(如事件日志记录)

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2014-02-17
    • 1970-01-01
    • 2019-01-03
    • 1970-01-01
    • 1970-01-01
    • 2016-12-17
    相关资源
    最近更新 更多