2017-02-17 45 views
0

一个混合我有需要处理的手势等swipe和移动设备上tap的应用程序。我正在使用ember-gestures插件来实现这一点。如何有条件地混合根据设备类型

在组件中混合这些附加代码并添加事件处理程序在移动设备上很重要,但在桌面设备上完全无用。

如何有条件地混合mixin?如果代码在移动设备上运行,我希望检测该设备并有条件地混合mixin。

示例代码:

import Ember from 'ember'; 
import RecognizerMixin from 'ember-gestures/mixins/recognizers'; 

export default Ember.Component.extend(RecognizerMixin, { 
    recognizers: 'swipe', 

    swipe(e) { 
    //mobile swipe event 
    } 
}); 

回答

1

快速正肮脏的方式是:

import Ember from 'ember'; 
import mixin from '../mixins/my-mixin'; 

let component = Ember.Component.extend({ 
}); 

if(/*your device control logic would be here.*/){ 
    component.reopen(mixin); 

    component.reopen({ 
    recognizers: 'swipe', 
    swipe(e) { 
     //mobile swipe event 
    } 

    }); 
} 

export default component; 

一个更好的建议是:做上述逻辑在初始化或实例初始化。因为这不是关于你的组件逻辑,所以这是一个横切关注点,应该从你的组件中分离出来。