javascript - paper-ripple mouseDown 事件处理程序 downAction 覆盖

Question

polymer 1.1

在 paper ripple source code他们有 mouseDown 事件处理程序:

  /** @param {Event=} event */
  downAction: function(event) {
    var xCenter = this.containerMetrics.width / 2;
    var yCenter = this.containerMetrics.height / 2;

在文档中指出:

paper-ripple listens to "mousedown" and "mouseup" events so it would display ripple effect when touches on it. You can also defeat the default behavior and manually route the down and up actions to the ripple element

但是，在我的自定义元素中，我无法覆盖此处理程序:

        <paper-ripple
          fit
          id="ripple"
          initial-opacity="0.95"
          opacity-decay-velocity="0.98">
        </paper-ripple>
      </section>
    </template>
  </template>

  <script>
    Polymer({
      is: "portfolio-page",
     ...
      downAction: function(e) {
        console.log('sssssssssssssssssssssssss');
      },
      upAction: function(e) {
        this.$.ripple.upAction();
      }

当我通过单击我的元素来诱发 paper 波纹的 Action 时，我没有得到任何控制台输出。

如何覆盖 paper-ripple 监听的 mouseDown 默认 downAction 处理程序，如 paper-ripple doc 中所述？

Answer 1

最有可能的文档假设应该添加一个监听器，例如

listeners: {
    'up' : 'upAction',
    'down' : 'downAction',
}

您仍然可以重写这些方法，但这可能不是ripple元素应该使用的方式:

ready: function(){
   this.ripplesDownAction = this.$.ripple.downAction.bind(this.$.ripple);
   this.$.ripple.downAction = this.downAction.bind(this);
},

downAction: function(e) {
    console.log('sssssssssssssssssssssssss');
    this.ripplesDownAction();
}