Przeglądaj źródła

Merge branch 'dev' of http://gogs.gzzzyd.com/xiaowenhua/vueDataV into dev

Cooklalala 5 miesięcy temu
rodzic
commit
7dff260ac1
4 zmienionych plików z 61 dodań i 58 usunięć
  1. 28 29
      src/components/bgBox/index.vue
  2. 2 23
      src/main.js
  3. 31 0
      src/util/index.js
  4. 0 6
      src/views/page1/index.vue

+ 28 - 29
src/components/bgBox/index.vue

@@ -58,23 +58,7 @@
 
 <script>
 import { screenSize, getWeather } from '@/assets/js/utils'
-
-const apiList = [
-  {
-    key: `currentWeather`,
-    fn(data, arg) {
-      const item = getWeather(data.天气)
-      this.weather = data
-      this.weather.天气图标 = item.icon || `icon-duoyun`
-    },
-  },
-  {
-    key: `currentTime`,
-    fn(data, arg) {
-      this.dateBox = data
-    },
-  },
-]
+import dayjs from 'dayjs'
 
 export default {
   components: {},
@@ -116,23 +100,38 @@ export default {
   },
   computed: {},
   created() {
-    console.log(`进入了`)
-    apiList.forEach((item) => {
-      this.$bus.$on(item.key, (data) => {
-        item.fn.call(this, data)
-      })
-    })
+    this.$util.autoVueFn(
+      [
+        {
+          time: 1000,
+          fn: this.currentTime,
+        },
+        {
+          time: 1000 * 5,
+          fn: this.currentWeather,
+        },
+      ],
+      this
+    )
   },
   mounted() {
     screenSize(this.$refs.editor)
   },
-  beforeDestroy() {
-    apiList.forEach((item) => {
-      console.log(`销毁了`, item.key)
-      this.$bus.$off(item.key)
-    })
+  methods: {
+    async currentWeather() {
+      const data = await this.$http.get(`/api/currentWeather`)
+      const item = getWeather(data.天气)
+      this.weather = data
+      this.weather.天气图标 = item.icon || `icon-duoyun`
+    },
+    async currentTime() {
+      const data = {
+        date: dayjs(Date.now()).format(`YYYY/MM/DD`),
+        time: dayjs(Date.now()).format(`HH:mm:ss`),
+      }
+      this.dateBox = data
+    },
   },
-  methods: {},
 }
 </script>
 

+ 2 - 23
src/main.js

@@ -7,6 +7,7 @@ import store from './store'
 import vueParticles from 'vue-particles'
 import Vcomp from './components/index'
 import Toast from './components/toast'
+import util from '@/util/index.js'
 
 import '@/assets/styles/base.scss'
 import '@/assets/styles/common.scss'
@@ -21,6 +22,7 @@ Vue.use(Vcomp)
 Vue.config.productionTip = false
 
 Vue.prototype.$Toast = Toast
+Vue.prototype.$util = util
 
 router.beforeEach((to, from, next) => {
   if (to.meta.title) {
@@ -33,27 +35,4 @@ window.$this = new Vue({
   router,
   store,
   render: (h) => h(App),
-  beforeCreate() {
-    Vue.prototype.$bus = this
-    Vue.prototype.$apiObj = http.apiObj
-    Object.entries(http.apiObj).forEach(([key, item]) => {
-      const fn = () => {
-        if (typeof item.api === `string`) {
-          this.$http
-            .get(item.api, {
-              params: item.arg,
-            })
-            .then((res) => {
-              this.$bus.$emit(key, res, item.arg)
-            })
-        } else {
-          item.api(item.arg).then((res) => {
-            this.$bus.$emit(key, res, item.arg)
-          })
-        }
-      }
-      fn()
-      setInterval(fn, item.time)
-    })
-  },
 }).$mount(`#app`)

+ 31 - 0
src/util/index.js

@@ -12,6 +12,37 @@ function isType(data, type = undefined) {
   return type ? dataType === type.toLowerCase() : dataType
 }
 
+/**
+  autoList 参考示例
+  [
+    {
+      time: 1000 * 5, // 循环调用时间
+      fn: this.currentTime, // 要调用的函数
+    }
+  ]
+**/
+function autoVueFn(autoList = [], vm) {
+  vm._timer = []
+  autoList.forEach((item) => {
+    const fn = () => {
+      item.fn.call(vm)
+    }
+    fn()
+    const timer = setInterval(fn, item.time)
+    vm._timer.push(timer)
+  })
+  vm.$options.beforeDestroy = [
+    ...(vm.$options.beforeDestroy || []),
+    function () {
+      vm._timer.forEach((item) => {
+        console.log(`卸载`, item)
+        clearInterval(item)
+      })
+    },
+  ]
+}
+
 export default {
+  autoVueFn,
   isType,
 }

+ 0 - 6
src/views/page1/index.vue

@@ -261,12 +261,6 @@ export default {
     // this.getAnalysisOfTransplantingSituation()
     screenSize(this.$refs.editor)
   },
-  beforeDestroy() {
-    apiLists.forEach((item) => {
-      console.log(`销毁了`, item.key)
-      this.$bus.$off(item.key)
-    })
-  },
   methods: {
     tabChange(val) {
       if (val === 0) {