处理单击并双击emberjs中的同一视图

时间:2014-11-17 07:49:03

标签: ember.js

我有一个需要同时处理点击和双击的组件。它的代码就像

模板:

<div class="routine_week routine-border box-height-fix fl pointer">
{{mark-down marking}}
</div>

组件

import Ember from 'ember';

export default Ember.Component.extend({
    marking : 0,
    isMarkable : false,

    click : function(){
        //click here
    },

    doubleClick : function(){
        //double click here
    }


});

现在问题是doubleClick从未被解雇过。如果是这样,它也会触发两个click个事件。如何确保doubleclick事件不会与click

互动

1 个答案:

答案 0 :(得分:3)

Ember非常强大,我可以使用SingleClick事件模仿DoubleClick。它全部取决于 Ember.run 循环。以下是像我一样尝试这样做的人的代码 -

//capture event for singleClick only execute if there is no doubleClick
eventIO : null,

//ember actually execute the doubleClick but it also gives two singleClick
doubleClick : function(){

    var eventIO = this.get('eventIO');

    //check if there is any event for single click, disable it
    if(eventIO != null){
        Ember.run.cancel(eventIO);
        this.set('eventIO',null);
    }

    // do the stuff with double click

},

// our click event which got executed in both single / double click
click : function(){

    var eventIO = this.get('eventIO');

    //if this is the first click , schedule it for later after 500 ms
    if(eventIO === null)
    {
        var eventIO =  Ember.run.later(this,function(){

            //do single click stuff

            var eventIO = this.get('eventIO');

            ///clear additional events
            if(eventIO != null){
                Ember.run.cancel(eventIO);
                this.set('eventIO',null);
            }

        },500);

        //register event to the component
        this.set('eventIO',eventIO);
    }

},