来自父代的Polymer 2.0呼叫子事件 [英] Polymer 2.0 call child event from parent
本文介绍了来自父代的Polymer 2.0呼叫子事件的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
关于在Polymer 2.0中从父级调用子级事件,我一直遇到一些不好的例子或过时的1.0文档.基本上,我要完成的就是从父级触发子级事件.但是当调用"this"时,我似乎也找不到在父元素的树结构中找到引用.
I keep running into bad examples or outdated 1.0 docs regarding calling child event from the parent in Polymer 2.0. Essentially all I want to accomplish is triggering a child event from the parent. But I also can not seem to find a reference in the tree structure of the parent element as well when call "this".
Index.html
<!DOCTYPE html>
<html>
<head>
<link rel="import" href="/elements/parent-element.html">
</head>
<body>
<parent-element></parent-element>
<script src="js/polymer.js"></script>
</body>
</html>
parent-element.html
<link rel="import" href="../bower_components/polymer/polymer.html">
<link rel="import" href="./child-element.html">
<dom-module id="parent-element">
<template>
<div>
parent
<child-element></child-element>
</div>
</template>
<script>
class ParentElement extends Polymer.Element {
constructor(){
super()
}
callChildEvent(){
// call event
}
static get is() {
return "parent-element";
}
}
customElements.define(ParentElement.is, ParentElement);
</script>
</dom-module>
child-element.html
<link rel="import" href="../bower_components/polymer/polymer.html">
<dom-module id="child-element">
<template>
<div on-click="customEvent">
child element
</div>
</template>
<script>
class ChildElement extends Polymer.Element {
constructor(){
super()
}
childEvent(){
console.log('event fired');
}
static get is() {
return "child-element";
}
}
customElements.define(ChildElement.is, ChildElement);
</script>
</dom-module>
感谢您的帮助!
推荐答案
为
<child-element id="childEl"></child-element>
并在父级上触发子元素功能,如:
And fire child element function at parent like:
this.$.childEl.childEvent();
这篇关于来自父代的Polymer 2.0呼叫子事件的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文