我正在使用Polymer Web Components .
每当我使用 this.$
时我收到一个错误,它未定义。我也尝试过 this.shadowRoot
并且它声明它为空。
例如:
内部<polymer-element>
:
<script>
Polymer({
cardClick: function(event, detail, sender) {
this.$.ordertemplatediv.style.display = 'none';
// the above line gives the following error:
// "Uncaught TypeError: Cannot read property 'style' of undefined"
this.shadowRoot.querySelector('#ordertemplatediv').style.display = 'none';
// the above line gives the following error:
// "Uncaught TypeError: Cannot read property 'style' of null"
}
});
</script>
在另一个里面<polymer-element>
在另一个文件中:(为了清楚起见,省略了结束标签)
<template>
<div id="ordertemplatediv">
<template repeat="{{item in items}}">
<!-- some irrelevant elements -->
两个文件的根元素都是<polymer-element>
.
我尝试使用this.$
在这个项目的不同情况下多次出现,但从未成功。有什么想法吗?
如有任何帮助,我们将不胜感激。
编辑 1 - 上下文
这就是我真正想做的:
我有 3 <polymer-elements>
我们称之为<list-1>
, <l-card>
和<list-2>
.
<list-1>
看起来像这样:(为了清楚起见,省略了结束标签)
<polymer-element name="list-1">
<template>
<template repeat="{{post in posts}}">
<l-card>
<l-card>
包含<script>
如上所述。
<list-2>
包含<template>
如上所述。
我想要<list-2>
当 <l-card>
时刷新(数据重新加载)在<list-2>
被点击(或点击)。
最佳答案
如果您要分隔 Polymer()
调用 <polymer-element>
它注册后,您需要传递元素的名称:
Polymer('your-element', {
...
});
否则,您需要输入 <template>
里面<polymer-element>
所以无名注册是有效的。
关于javascript - polymer 自动节点查找不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26636780/