进入后台停止auto

layouts/default.vue

@@ -59,6 +59,7 @@ export default {
         }, 500)
       })
     }, false)
+    this.visibilitychange() // 监听页面是否进入后台
   },
   methods: {
     ...mapActions({
@@ -68,6 +69,7 @@ export default {
       'SetZoom',
       'SetInnerWidth',
       'SetInnerHeight',
+      'SetHidePage',
     ]),
     initSceen() {
       const { innerWidth, innerHeight } = window
@@ -119,6 +121,17 @@ export default {
       }
       this.isMoblie = true
     },
+    visibilitychange() {
+      document.addEventListener('visibilitychange', () => {
+        if (document.hidden) {
+          console.log('H5已切换到后台或手机息屏')
+          this.SetHidePage(true)
+        } else {
+          console.log('H5已切换到网页')
+          this.SetHidePage(false)
+        }
+      })
+    },
   },
 }
 </script>

pages/index/game/components/keyboard.vue

@@ -154,14 +154,14 @@
           </div>
         </div>
       </div>
-
+      {{ hidePage }}
       <img v-audio class="spin btn" src="https://kuawai.s3.ap-east-1.amazonaws.com/resource/assets/Textures/mobileKeyboard/spin.png" alt="" @click="click().play()">
     </div>
   </div>
 </template>
 
 <script>
-import { mapGetters, mapMutations, } from 'vuex'
+import { mapGetters, mapMutations, mapState, } from 'vuex'
 export default {
   filters: {
     autoTimeFilter(value) {
@@ -201,6 +201,9 @@ export default {
     }
   },
   computed: {
+    ...mapState([
+      'hidePage',
+    ]),
     ...mapGetters([
       'is_mobile',
     ]),
@@ -237,6 +240,14 @@ export default {
     fullState(value) {
       this.SetHideHeader(value) // 全屏的时候隐藏头部
     },
+    hidePage(value) {
+      if (value) {
+        console.log('进入后台，停止游戏')
+        this.autoTime = 0
+        this.cancelAutoClick = 0
+        this.network().autoPlay('release')
+      }
+    },
   },
   created() {
     if (this.buttonValue) {

store/index.js

@@ -44,6 +44,7 @@ export const state = () => ({
   }, // app配置
   dictionary: {}, // 数据字典
   hideHeader: false, // 是否隐藏layout的header
+  hidePage: false,
   ossConfig: {
     access_key: '',
     secret: '',
@@ -187,6 +188,9 @@ export const mutations = {
     // console.log('SetInnerHeight', data)
     state.hideHeader = data
   },
+  SetHidePage(state, data) {
+    state.hidePage = data
+  },
 }
 
 export const actions = {