fix(projects): 修复百度地图sdk地址

.eslintrc.js

@@ -9,7 +9,7 @@ module.exports = {
     defineExpose: 'readonly',
     withDefaults: 'readonly',
     PROJECT_BUILD_TIME: 'readonly',
-    BMapGL: 'readonly'
+    BMap: 'readonly'
   },
   parser: 'vue-eslint-parser',
   parserOptions: {
@@ -34,6 +34,7 @@ module.exports = {
     'import/prefer-default-export': 0,
     'no-use-before-define': 'off',
     'vue/multi-word-component-names': 0,
+    'max-classes-per-file': 0,
     '@typescript-eslint/no-explicit-any': 0,
     '@typescript-eslint/no-inferrable-types': 0,
     '@typescript-eslint/ban-ts-ignore': 'off',

src/hooks/common/index.ts

@@ -7,7 +7,6 @@ import useRouteProps from './useRouteProps';
 import useBoolean from './useBoolean';
 import useLoading from './useLoading';
 import useScrollBehavior from './useScrollBehavior';
-import useScript from './useScript';
 
 export {
   useAppTitle,
@@ -18,6 +17,5 @@ export {
   useRouteProps,
   useBoolean,
   useLoading,
-  useScrollBehavior,
-  useScript
+  useScrollBehavior
 };

src/hooks/common/useScript.ts

@@ -1,45 +0,0 @@
-import { onUnmounted } from 'vue';
-import useLoading from './useLoading';
-import useBoolean from './useBoolean';
-
-export default function useScript(src: string) {
-  const { loading, startLoading, endLoading } = useLoading();
-  const { bool: isSuccess, setTrue: setIsSuccess, setFalse: setNotSuccess } = useBoolean();
-
-  let script: HTMLScriptElement;
-  function removeScript() {
-    if (script) {
-      script.remove();
-    }
-  }
-
-  function load() {
-    startLoading();
-    return new Promise((resolve, reject) => {
-      script = document.createElement('script');
-      script.type = 'text/javascript';
-      script.onload = () => {
-        endLoading();
-        setIsSuccess();
-        resolve('');
-      };
-      script.onerror = err => {
-        endLoading();
-        setNotSuccess();
-        reject(err);
-      };
-      script.src = src;
-      document.head.appendChild(script);
-    });
-  }
-
-  onUnmounted(() => {
-    removeScript();
-  });
-
-  return {
-    loading,
-    isSuccess,
-    load
-  };
-}

src/settings/constant.ts

@@ -1,2 +1,3 @@
 /** 百度地图sdk地址 */
-export const BAIDU_MAP_SDK_URL = 'https://api.map.baidu.com/api?v=1.0&&type=webgl&ak=KSezYymXPth1DIGILRX3oYN9PxbOQQmU';
+export const BAIDU_MAP_SDK_URL =
+  'https://api.map.baidu.com/getscript?v=3.0&ak=KSezYymXPth1DIGILRX3oYN9PxbOQQmU&services=&t=20210201100830&s=1';

src/typings/bmapgl.d.ts

@@ -1 +1,5 @@
 /// <reference types="bmapgl" />
+declare namespace BMap {
+  class Map extends BMapGL.Map {}
+  class Point extends BMapGL.Point {}
+}

src/views/component/map/components/BaiduMap.vue

@@ -3,19 +3,18 @@
 </template>
 
 <script setup lang="ts">
-import { ref, onMounted, nextTick } from 'vue';
+import { ref, onMounted } from 'vue';
+import { useScriptTag } from '@vueuse/core';
 import { BAIDU_MAP_SDK_URL } from '@/settings';
-import { useScript } from '@/hooks';
 
-const { load } = useScript(BAIDU_MAP_SDK_URL);
+const { load } = useScriptTag(BAIDU_MAP_SDK_URL);
 
 const domRef = ref<HTMLDivElement | null>(null);
 
 async function renderBaiduMap() {
-  await load();
-  await nextTick();
-  const map = new BMapGL.Map(domRef.value!);
-  const point = new BMapGL.Point(116.404, 39.915);
+  await load(true);
+  const map = new BMap.Map(domRef.value!);
+  const point = new BMap.Point(114.05834626586915, 22.546789983033168);
   map.centerAndZoom(point, 15);
   map.enableScrollWheelZoom();
 }