首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >得到聚合物母元

得到聚合物母元
EN

Stack Overflow用户
提问于 2015-03-11 04:55:15
回答 4查看 16.3K关注 0票数 15

所以我使用聚合物已经有一天了,我在这个问题的措辞上有困难,所以如果我的方法偏离了基础,请不要觉得有必要解决这个问题,而要指出正确的方向。

我所拥有的是自定义元素中的自定义元素,我希望有一个子元素来影响父元素的属性。我采用的方法是创建一个单击处理程序,关闭IIFE中的父元素,然后将该处理程序传递给子组件。像这样..。

代码语言:javascript
运行
复制
Polymer({
  ready: function(){
     this.superHandler = (function(p) {
        return function() {
          // "this" here will be the sub-component
          p.title = this.title;
        }
     })(this);
  }
});

父元素在它的模板中使用它,比如..。

代码语言:javascript
运行
复制
<polymer-element name="parent-element">
  <template>
    <sub-element on-click={{superHandler}} />
  </template>
</polymer-element>

这个(在我真正的代码中,虽然这里可能有排版)除了IE外什么都能用,而且我知道IE没有得到官方支持,但它太接近了,我不想放弃它。我想避免的是重复引用parentNodes和shadowRoots,以便找到我要寻找的父类。

编辑

我忘记提到它在IE中是如何失败的,以及为什么我想避免使用parentNode调用。在IE中,当它专门分派polymer.js的第9131行事件时,变量" method“和objmethod中的引用是IE中的字符串,因此没有方法应用。我想避免使用parentNode的原因是,调用方不是直接的父级,所以在找到正确的parentNodes之前,我不想一直获取parentNodes,因为当我能够命名变量时,代码更容易理解。

编辑2

我现在要做的是(因为它在IE9中工作),尽管我把这个问题留给一个更好的答案,那就是继续这个生命,返回一个函数,这个函数就是这个子函数。然后,孩子将通过一个querySelector找到感兴趣的父母。这意味着孩子必须事先了解父母和调用的方法,这并不理想,但是.即。

所以家长把它设为..。

代码语言:javascript
运行
复制
Polymer('parent-element', {
  ready: function(){
     this.superHandler = (function(p) {
        return function(child) {
          p.title = chile.title;
        }
     })(this);
  }
});

子元素必须通过查询选择器获得,比如“父元素”,并知道名称“superHandler”(不是实际名称)。

代码语言:javascript
运行
复制
Polymer('child-element',{
        clickHandler: function(){
            var p = document.querySelector('parent-element').superHandler;
            p(this);
        }
    });

更好的主意?

EN

回答 4

Stack Overflow用户

回答已采纳

发布于 2015-03-16 14:57:09

谢谢您的定制活动建议。这让我回到过去,再次查看核心元素,以找到

然后我只需要添加一个

代码语言:javascript
运行
复制
<core-signals on-core-signal-my-event="{{myEventHandler}}"></core-signals>

激发“核信号”事件的名称(在本例中)“我-事件”,并创建一个方法"myEventHandler“上的父。

代码语言:javascript
运行
复制
Polymer({
  myEventHandler: function(e,detail,sender) {...}
})
票数 1
EN

Stack Overflow用户

发布于 2015-03-16 14:19:08

您可以使用自己的事件在元素之间传递数据。

父组件:

代码语言:javascript
运行
复制
<polymer-element name="parent-element">
  <template>
    <!-- ... -->
    <sub-element></sub-element>
  </template>
  <script>
  Polymer({
    ready: function() {
      this.addEventListener('eventFromChild', this.myAction);
    },
    myAction: function(event) {
      console.log(event.detail);
    },
  });
  </script>

儿童部分:

代码语言:javascript
运行
复制
<polymer-element name="sub-element" attributes="foo bar">
  <template>
    <!-- ... -->
    <button on-click="{{passParams}}">Send</button>
  </template>
  <script>
  Polymer({
    ready: function() {
      this.foo = 'abc';
      this.bar = '123';
    },
    passParams: function() {
      this.fire('eventFromChild', { foo: this.foo, bar: this.bar });
    },
  });
</script>
票数 16
EN

Stack Overflow用户

发布于 2015-03-11 08:51:44

以下是访问Javascript中父元素的简单方法。这适用于个人工作 (聚合物0.5 -正如注释中提到的,在1.0中情况不同)。没有在IE上进行测试,但在我看来,这是一个简单的解决方案:

代码语言:javascript
运行
复制
Polymer('sub-element', {
  ready: function(){
     this.parentNode;
  }
});
票数 3
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/28978843

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档