Question

我的应用需要在移动设备上处理 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
  }
});

Answer 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;

更好的建议将是：在初始化程序或实例初始化程序中执行上述逻辑。因为这与您的组件逻辑无关，所以这是一个跨领域的问题，应该与您的组件分开。

如何根据设备类型有条件地混合mixin

1 个答案: