fix: ssr

packages/@moefe/vue-aplayer/components/APlayer.tsx

@@ -7,6 +7,7 @@ import classNames from 'classnames';
 import _Hls from 'hls.js';
 import Audio, { ReadyState, events } from '@moefe/vue-audio';
 import Store from '@moefe/vue-store';
+import Mixin from 'utils/mixin';
 import Player, { Notice } from './Player';
 import PlayList from './PlayList';
 import Lyric from './Lyric';
@@ -25,7 +26,7 @@ if (typeof BroadcastChannel !== 'undefined') {
   channel = new BroadcastChannel('aplayer');
 }
 
-@Component
+@Component({ mixins: [Mixin] })
 export default class APlayer extends Vue.Component<
   APlayer.Options,
   APlayer.Events
@@ -117,11 +118,6 @@ export default class APlayer extends Vue.Component<
     return shuffle([...this.orderList]);
   }
 
-  // eslint-disable-next-line class-methods-use-this
-  private get isMobile(): boolean {
-    return /mobile/i.test(window.navigator.userAgent);
-  }
-
   // 是否正在缓冲
   private get isLoading(): boolean {
     const { preload, currentPlayed, currentLoaded } = this;
@@ -132,6 +128,8 @@ export default class APlayer extends Vue.Component<
 
   private readonly options!: APlayer.InstallOptions;
 
+  private readonly isMobile!: boolean;
+
   // 是否正在拖动进度条（防止抖动）
   private isDraggingProgressBar = false;
 

packages/@moefe/vue-touch/index.tsx

@@ -1,6 +1,7 @@
 import * as Vue from 'vue-tsx-support';
 import Component from 'vue-class-component';
 import { Prop } from 'vue-property-decorator';
+import Mixin from 'utils/mixin';
 
 export interface TouchProps {
   panMoveClass?: string;
@@ -12,23 +13,20 @@ export interface TouchEvents {
   onPanEnd: MouseEvent | TouchEvent;
 }
 
-@Component
+@Component({ mixins: [Mixin] })
 export default class Touch extends Vue.Component<TouchProps, TouchEvents> {
   @Prop({ type: String, required: false })
   private readonly panMoveClass!: string;
 
+  private readonly isMobile!: boolean;
+
   private isDragMove: boolean = false;
 
   private get classNames() {
     const { panMoveClass, isDragMove } = this;
     return { [panMoveClass]: isDragMove };
   }
 
-  // eslint-disable-next-line class-methods-use-this
-  private get isMobile(): boolean {
-    return /mobile/i.test(window.navigator.userAgent);
-  }
-
   private get dragStart(): 'touchstart' | 'mousedown' {
     return this.isMobile ? 'touchstart' : 'mousedown';
   }

utils/mixin.ts

@@ -0,0 +1,12 @@
+import Vue from 'vue';
+import Component from 'vue-class-component';
+
+@Component
+export default class Mixin extends Vue {
+  private get isMobile(): boolean {
+    const ua = this.$ssrContext
+      ? this.$ssrContext.userAgent
+      : window.navigator.userAgent;
+    return /mobile/i.test(ua);
+  }
+}