纸质按钮聚合物元素上的错误点击事件
Error on-tap event on paper-button polymer element
我遇到了聚合物中的一个元素的问题,我正在尝试显示一个按钮,当按钮点击事件被触发时,我想调用一个函数。
控制台异常:
[my-blogentry::_createEventHandler]: listener method toggle
not
defined
这是元素的源代码:
<dom-module id="my-blogentry">
<template>
<style>
:host {
display: block;
}
.div-general{
</style>
<div class="div-general">
<template is="dom-repeat" items="{{entries}}">
<paper-material elevation="1" animated="true" class="paper-material-presentation">
<div class="div-date-left">
<span>{{item.date}}</span>
</div>
<div>
<iron-image src$="../../images/{{item.image}}" style="width:128px; height:128px;" sizing="cover"></iron-image>
{{item.resume}}
<paper-button id="bt_readmore" on-tap="toggle">Read More</paper-button>
<iron-collapse id="collapse">
<div>{{item.content}}</div>
</iron-collapse>
</div>
</paper-material>
</template>
</div>
</template>
<script>
Polymer({
is: 'my-blogentry',
ready: function() {
this.entries = [
{id: '1', title: ‘xxx.', date: 'Tuesday, March 8, 2016', image:'im-blogdefault.png', resume:’xxx’,content:’xxxx’}
];
}
});
toggle = function () {
this.$.collapse.toggle();
}
</script>
我将不胜感激。
您需要将 toggle
方法移动到 Polymer elements 代码中
Polymer({
is: 'my-blogentry',
ready: function() {
this.entries = [
{id: '1', title: ‘xxx.', date: 'Tuesday, March 8, 2016', image:'im-blogdefault.png', resume:’xxx’,content:’xxxx’}
];
},
toggle: function () {
// this.$.collapse.toggle();
his.$$('#collapse').toggle();
}
});
我遇到了聚合物中的一个元素的问题,我正在尝试显示一个按钮,当按钮点击事件被触发时,我想调用一个函数。
控制台异常:
[my-blogentry::_createEventHandler]: listener method
toggle
not defined
这是元素的源代码:
<dom-module id="my-blogentry">
<template>
<style>
:host {
display: block;
}
.div-general{
</style>
<div class="div-general">
<template is="dom-repeat" items="{{entries}}">
<paper-material elevation="1" animated="true" class="paper-material-presentation">
<div class="div-date-left">
<span>{{item.date}}</span>
</div>
<div>
<iron-image src$="../../images/{{item.image}}" style="width:128px; height:128px;" sizing="cover"></iron-image>
{{item.resume}}
<paper-button id="bt_readmore" on-tap="toggle">Read More</paper-button>
<iron-collapse id="collapse">
<div>{{item.content}}</div>
</iron-collapse>
</div>
</paper-material>
</template>
</div>
</template>
<script>
Polymer({
is: 'my-blogentry',
ready: function() {
this.entries = [
{id: '1', title: ‘xxx.', date: 'Tuesday, March 8, 2016', image:'im-blogdefault.png', resume:’xxx’,content:’xxxx’}
];
}
});
toggle = function () {
this.$.collapse.toggle();
}
</script>
我将不胜感激。
您需要将 toggle
方法移动到 Polymer elements 代码中
Polymer({
is: 'my-blogentry',
ready: function() {
this.entries = [
{id: '1', title: ‘xxx.', date: 'Tuesday, March 8, 2016', image:'im-blogdefault.png', resume:’xxx’,content:’xxxx’}
];
},
toggle: function () {
// this.$.collapse.toggle();
his.$$('#collapse').toggle();
}
});