Question

我正在使用导航视图。最初它有一个包含按钮的项目（视图）。点击此按钮时，第二个视图将按下导航视图。如果用户有意或无意地双击该按钮，则会按下第二个视图两次。我该如何解决这个问题？

我已经尝试了此链接http://docs.sencha.com/touch/2.3.0/#!/guide/events中指定的缓冲区配置，但此解决方案的问题是它在缓冲时间之后甚至在第一次点击时调用侦听器。

以下是演示此问题的示例代码。

导航视图

Ext.define('Many.view.Main', {
    extend: 'Ext.navigation.View',
    xtype: 'main',
    config: {
        items: [
            {
                xtype:'firstView'
            }           
        ]
    }
});

第一视图

Ext.define('Many.view.FirstView', {
    extend: 'Ext.Panel',
    xtype: 'firstView',
    config: {
        title: 'First View',
        items: [
            {
                xtype: 'button',
                id:'myButton',
                text: 'Push Second View'
            }
        ]
    }
});

第二视图

Ext.define('Many.view.SecondView', {
    extend: 'Ext.Panel',
    xtype: 'secondView',
    config: {
        items: [
            {
                docked: 'top',
                xtype: 'titlebar',
                title: 'Second View'
            }
        ]
    }
});

控制器

Ext.define('Many.controller.Main', {
    extend : 'Ext.app.Controller',
    config : {
        refs : {
            myNavigationView : 'main',
            myButton :'main #myButton'
        },
        control : {
            myButton : {
                tap : 'pushSecondView'
            }
        }
    },
    pushSecondView: function () {
        var secondView = Ext.create('Many.view.SecondView');
        this.getMyNavigationView().push(secondView);
    }
});

Answer 1

只需在视口中添加该视图是否存在的条件。

在controller中添加一个像这样的引用： -

refs : {
            myNavigationView : 'main',
            myButton :'main #myButton',
            secondView : 'secondView'
        }

并添加条件： -

pushSecondView: function () {
     if(!this.getSecondView()){
        var secondView = Ext.create('Many.view.SecondView');
        this.getMyNavigationView().push(secondView);
      }
    }

Answer 2

以下是我的表现方式：

＆＃13;

    /**
	 * This method will be called from every item in the app that can be double tapped to push multiple items.
	 * 
	 * @returns {Boolean}
	 */
	ENSURE_NO_DOUBLE_TAP : function(classNameToPush) {
		if (Ext.getClassName(Ext.getCmp('navigationview').getActiveItem()) == classNameToPush) {
			console.log("Prevented DoubleTap.");
			return false;
		}

		return true;
	}

＆＃13;

然后从任何使用navigationView.push的控制器（{＆＃39; theViewImPushing＆＃39;}）：

＆＃13;

		if (!ENSURE_NO_DOUBLE_TAP('App.view.TheViewImPushing')) {
			return;
		}

＆＃13;

我保留一个Statics单例类来调用ENSURE_NO_DOUBLE_TAP方法...但你可以在任何地方使用它。

导航视图中的多次点击问题

2 个答案: