javascript - 纸质按钮聚合物元素上的错误点击事件

Question

我在聚合物中遇到了这个问题，我正在尝试显示一个按钮，当按钮点击事件被触发时，我想调用一个函数。

控制台异常:

[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>

我将不胜感激。

Answer 1

您需要将 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();
     }
  });