swkk: 现在不settimeout也不会卡死了……

src/views/SwkkView.vue

@@ -1,6 +1,5 @@
 <template>
   <div
-    v-show="canShow"
     class="skww-view"
   >
     <div
@@ -171,8 +170,6 @@ export default {
   data() {
     //这里存放数据
     return {
-      canShow: false,
-
       kankan: null,
       isLoading: true,
 
@@ -237,164 +234,162 @@ export default {
   beforeMount() {
   },
   mounted() {
-    setTimeout(() => {
-      this.canShow = true
-
-      this.$msgCenter.publish('show-loading')
-      let floor = this.$route.query.floor
-      this.floor = floor
-      let sceneCode = ''
-      if (floor === "1") sceneCode = process.env.VUE_APP_SCENE_CODE_FLOOR_1
-      else if (floor === "2") sceneCode = process.env.VUE_APP_SCENE_CODE_FLOOR_2
-      console.assert(sceneCode, 'no sceneCode!')
-
-      // 不等一秒，就会因为use了小地图而卡死？
-      // setTimeout(() => {
-      let kankan = new KanKan({
-        dom: ".swkk-wrap",
-        num: sceneCode,
-      })
-
-      kankan.use("MinMap", {
-        theme: {
-          camera_fillStyle: "#930909",
-        },
+    // setTimeout(() => {
+    this.$msgCenter.publish('show-loading')
+    let floor = this.$route.query.floor
+    this.floor = floor
+    let sceneCode = ''
+    if (floor === "1") sceneCode = process.env.VUE_APP_SCENE_CODE_FLOOR_1
+    else if (floor === "2") sceneCode = process.env.VUE_APP_SCENE_CODE_FLOOR_2
+    console.assert(sceneCode, 'no sceneCode!')
+
+    // 不等一秒，就会因为use了小地图而卡死？
+    // setTimeout(() => {
+    let kankan = new KanKan({
+      dom: ".swkk-wrap",
+      num: sceneCode,
+    })
+
+    kankan.use("MinMap", {
+      theme: {
+        camera_fillStyle: "#930909",
+      },
+    })
+
+    kankan.use("TourPlayer").then((player) => {
+      player.on("play", ({ partId, frameId }) => {
+        this.isAutoMoving = true
+        this.isChangingAutoMovingStatus = false
+        this.mustMute()
       })
-
-      kankan.use("TourPlayer").then((player) => {
-        player.on("play", ({ partId, frameId }) => {
-          this.isAutoMoving = true
-          this.isChangingAutoMovingStatus = false
-          this.mustMute()
-        })
-        player.on("pause", ({ partId, frameId }) => {
-          this.isAutoMoving = false
-          this.isChangingAutoMovingStatus = false
-          this.cancelMustMute()
-        })
-        player.on("end", async () => {
-          this.isAutoMoving = false
-          this.isChangingAutoMovingStatus = false
-          this.progress = 0
-          this.frameId = null
-          this.cancelMustMute()
-        })
-
-        player.on("progress", ({ partId, frameId, progress }) => {
-          this.curSceneIdx = frameId
-          this.$refs['scene-item'][this.curSceneIdx].scrollIntoView()
-          this.autoMovingProgress = Number(progress * 100).toFixed(5)
-        })
+      player.on("pause", ({ partId, frameId }) => {
+        this.isAutoMoving = false
+        this.isChangingAutoMovingStatus = false
+        this.cancelMustMute()
       })
-
-      // 导览数据
-      kankan.TourManager.on("loaded", (tours) => {
-        try {
-          this.tourList = tours[0].list
-        } catch (e) {
-          console.error('没拿到导览数据：', e)
-          this.tourList = []
-        }
-        this.$msgCenter.publish('hide-loading')
+      player.on("end", async () => {
+        this.isAutoMoving = false
+        this.isChangingAutoMovingStatus = false
+        this.progress = 0
+        this.frameId = null
+        this.cancelMustMute()
       })
 
-      // 全部热点数据
-      kankan.store.on("tags", (tags) => {
-        this.baseHotData = tags.tags
+      player.on("progress", ({ partId, frameId, progress }) => {
+        this.curSceneIdx = frameId
+        this.$refs['scene-item'][this.curSceneIdx].scrollIntoView()
+        this.autoMovingProgress = Number(progress * 100).toFixed(5)
       })
+    })
+
+    // 导览数据
+    kankan.TourManager.on("loaded", (tours) => {
+      try {
+        this.tourList = tours[0].list
+      } catch (e) {
+        console.error('没拿到导览数据：', e)
+        this.tourList = []
+      }
+      this.$msgCenter.publish('hide-loading')
+    })
+
+    // 全部热点数据
+    kankan.store.on("tags", (tags) => {
+      this.baseHotData = tags.tags
+    })
+
+    // 热点
+    kankan.use("TagView", {
+      render(data) {
+        let ifNeedShow = false
+        // data.title如果没有“&”或者是“a&b&show”这样子，就要显示。
+        let arrTitle = data.title.split("&")
+        if (arrTitle[2] === 'show' || !data.title.includes("&")) {
+          ifNeedShow = true
+        }
 
-      // 热点
-      kankan.use("TagView", {
-        render(data) {
-          let ifNeedShow = false
-          // data.title如果没有“&”或者是“a&b&show”这样子，就要显示。
-          let arrTitle = data.title.split("&")
-          if (arrTitle[2] === 'show' || !data.title.includes("&")) {
-            ifNeedShow = true
-          }
-
-          let title = data.title.split("&")[0]
+        let title = data.title.split("&")[0]
 
-          return `
+        return `
               <span class="tag-icon animate" title=${title} style="${ifNeedShow ? "" : "display: none;"}; background-image: url({{icon}})"></span>
               <div class="tag-body"></div>
             `
-        },
-      }).then((TagView) => {
-        // 监听手动点击事件
-        TagView.on("click", (e) => {
-          // // 点击热点的时候当前背景音乐的播放状态
-          // let dom = document.querySelector("#bacMusic")
-          // window.bacMusic = !dom.paused
-          // setTimeout(() => {
-          //   this.$refs.RbottomRef.opMusic(false)
-          // }, 200)
-
-          if (e.data.title.split("&")[1]) { // 如果是多个热点合并
-            let hotspotList = []
-            this.hotspotRawData.forEach((item) => {
-              if (item.title.split("&")[1] === e.data.title.split("&")[1]) {
-                hotspotList.push(item)
-              }
-            })
-            let obj = {
-              image: [],
-              audio: [],
-              link: [],
-              video: [],
+      },
+    }).then((TagView) => {
+      // 监听手动点击事件
+      TagView.on("click", (e) => {
+        // // 点击热点的时候当前背景音乐的播放状态
+        // let dom = document.querySelector("#bacMusic")
+        // window.bacMusic = !dom.paused
+        // setTimeout(() => {
+        //   this.$refs.RbottomRef.opMusic(false)
+        // }, 200)
+
+        if (e.data.title.split("&")[1]) { // 如果是多个热点合并
+          let hotspotList = []
+          this.hotspotRawData.forEach((item) => {
+            if (item.title.split("&")[1] === e.data.title.split("&")[1]) {
+              hotspotList.push(item)
             }
-            hotspotList.forEach((hotspot) => {
-              obj[hotspot.type].push(hotspot)
-            })
-            this.hotspotDetail = obj
-          } else { // 单个热点
-            this.hotspotDetail = { [e.data.type]: [e.data] }
+          })
+          let obj = {
+            image: [],
+            audio: [],
+            link: [],
+            video: [],
           }
+          hotspotList.forEach((hotspot) => {
+            obj[hotspot.type].push(hotspot)
+          })
+          this.hotspotDetail = obj
+        } else { // 单个热点
+          this.hotspotDetail = { [e.data.type]: [e.data] }
+        }
 
-          // 聚焦当前点击的热点
-          TagView.focus(e.data.sid)
-        })
-      })
-
-      // 球幕视频的播放与暂停影响背景音乐的播放状态
-      kankan.Scene.on("panorama.videorenderer.startvideo", () => {
-        console.log('startvideo')
-        this.mustMute()
-      })
-
-      kankan.Scene.on("panorama.videorenderer.suspendrender", () => {
-        console.log('suspend')
-        this.cancelMustMute()
-      })
-
-      kankan.Scene.on("panorama.videorenderer.resumerender", () => {
-        console.log('resume')
-        this.mustMute()
-      })
-
-      kankan.Scene.on("loaded", () => {
-        console.log('loaded!')
-        this.isLoading = false
-        //设置地面logo
-        kankan.Scene.setFloorLogo({
-          url: "./img/diBiao.png",
-          size: 40,
-        })
+        // 聚焦当前点击的热点
+        TagView.focus(e.data.sid)
       })
-
-      // 监听看看的模式
-      kankan.Camera.on("mode.beforeChange", ({ toMode }) => {
-        this.mode = {
-          floorplan: 4,
-          dollhouse: 3,
-          panorama: 2,
-        }[toMode]
+    })
+
+    // 球幕视频的播放与暂停影响背景音乐的播放状态
+    kankan.Scene.on("panorama.videorenderer.startvideo", () => {
+      console.log('startvideo')
+      this.mustMute()
+    })
+
+    kankan.Scene.on("panorama.videorenderer.suspendrender", () => {
+      console.log('suspend')
+      this.cancelMustMute()
+    })
+
+    kankan.Scene.on("panorama.videorenderer.resumerender", () => {
+      console.log('resume')
+      this.mustMute()
+    })
+
+    kankan.Scene.on("loaded", () => {
+      console.log('loaded!')
+      this.isLoading = false
+      //设置地面logo
+      kankan.Scene.setFloorLogo({
+        url: "./img/diBiao.png",
+        size: 40,
       })
-
-      kankan.render()
-      this.kankan = kankan
-      // }, 1000)
-    }, 500)
+    })
+
+    // 监听看看的模式
+    kankan.Camera.on("mode.beforeChange", ({ toMode }) => {
+      this.mode = {
+        floorplan: 4,
+        dollhouse: 3,
+        panorama: 2,
+      }[toMode]
+    })
+
+    kankan.render()
+    this.kankan = kankan
+    // }, 1000)
+    // }, 500)
   },
   beforeDestroy() {
     this.stopAutoMoving()