Refactor(ALL):Vue3同步调整为Vue2

2024-02-29 10:46:13 +08:00
parent f3115fe7c8
commit 017bb4a66a
13 changed files with 1805 additions and 1930 deletions
@@ -49,88 +49,92 @@
  </view>
 </template>

-<script setup>
-import {onMounted, ref} from '@vue/composition-api'
+<script>
 import {getCurAddress, getLocation} from "@/utils/common";
 import {getVideoCity} from "@/api/video";

-const watchCity = ref(uni.getStorageSync('watchCity') || [])
-
-onMounted(() => {
-  getMapData()
-  fetchList()
-})
-
-const ready = ref(false)
-const cityName = ref('')
-const keyword = ref('')
-
-const onSearch = () => {
-  const name = keyword.value.trim()
-  if (name.length > 0) {
-    navToWatch(name)
-  }
-}
-
-const raw = ref()
-const searchList = ref([])
-const onChange = (value) => {
-  searchList.value = []
-  if (value.trim().length === 0) return
-  searchList.value = raw.value.filter(city => {
-    if (city['name'].indexOf(value) > -1) return city
-  })
-}
-
-const handleHistory = (name) => {
-  for (let i = 0; i < watchCity.value.length; i++) {
-    if (name === watchCity.value[i]) return
-  }
-  if (watchCity.value.length === 4) {
-    watchCity.value.pop()
-  }
-  watchCity.value.unshift(name)
-  uni.setStorageSync('watchCity', watchCity.value)
-}
-
-const getMapData = async () => {
-  const map = await getLocation();
-  if (map.length > 1) {
-    const {latitude, longitude} = map[1];
-    const address = await getCurAddress(latitude, longitude);
-    cityName.value = address[1].data.result['ad_info']['city']
-  }
-}
-
-const indexList = ref(["A", "B", "C"])
-const itemArr = ref([
-  ['列表A1', '列表A2', '列表A3'],
-  ['列表B1', '列表B2', '列表B3'],
-  ['列表C1', '列表C2', '列表C3']
-])
-
-const fetchList = async () => {
-  const res = await getVideoCity()
-  if (res.success) {
-    raw.value = res.data
-    const groupedByName = res.data.reduce((accumulator, current) => {
-      const groupKey = current['firstLetter'].toUpperCase()
-      if (!accumulator[groupKey]) {
-        accumulator[groupKey] = []
+export default {
+  data() {
+    return {
+      watchCity: [],
+      ready: false,
+      cityName: '',
+      keyword: '',
+      raw: null,
+      searchList: [],
+      indexList: ["A", "B", "C"],
+      itemArr: [
+        ['列表A1', '列表A2', '列表A3'],
+        ['列表B1', '列表B2', '列表B3'],
+        ['列表C1', '列表C2', '列表C3']
+      ]
+    }
+  },
+  mounted() {
+    this.watchCity = uni.getStorageSync('watchCity') || []
+    this.getMapData()
+    this.fetchList()
+  },
+  methods: {
+    async getMapData() {
+      const map = await getLocation();
+      if (map.length > 1) {
+        const {latitude, longitude} = map[1];
+        const address = await getCurAddress(latitude, longitude);
+        this.cityName = address[1].data.result['ad_info']['city']
      }
-      accumulator[groupKey].push(current)
-      return accumulator
-    }, {})
+    },

-    indexList.value = Object.keys(groupedByName)
-    itemArr.value = Object.values(groupedByName)
+    async fetchList() {
+      const res = await getVideoCity()
+      if (res.success) {
+        this.raw = res.data
+        const groupedByName = res.data.reduce((accumulator, current) => {
+          const groupKey = current['firstLetter'].toUpperCase()
+          if (!accumulator[groupKey]) {
+            accumulator[groupKey] = []
+          }
+          accumulator[groupKey].push(current)
+          return accumulator
+        }, {})
+
+        this.indexList = Object.keys(groupedByName)
+        this.itemArr = Object.values(groupedByName)
+      }
+      this.ready = true
+    },
+
+    onSearch ()  {
+      const name = this.keyword.trim()
+      if (name.length > 0) {
+        this.navToWatch(name)
+      }
+    },
+
+    navToWatch (name)  {
+      this.handleHistory(name)
+      uni.redirectTo({url: '/pkg-video/views/watch?name=' + name})
+    },
+
+    handleHistory (name) {
+      for (let i = 0; i < this.watchCity.length; i++) {
+        if (name === this.watchCity[i]) return
+      }
+      if (this.watchCity.length === 4) {
+        watchCity.value.pop()
+      }
+      this.watchCity.unshift(name)
+      uni.setStorageSync('watchCity', this.watchCity)
+    },
+
+    onChange (value)  {
+      this.searchList = []
+      if (value.trim().length === 0) return
+      this.searchList = this.raw.filter(city => {
+        if (city['name'].indexOf(value) > -1) return city
+      })
+    }
  }
-  ready.value = true
-}
-
-const navToWatch = (name) => {
-  handleHistory(name)
-  uni.redirectTo({url: '/pkg-video/views/watch?name=' + name})
 }
 </script>