From 969725647117eb7ca148b2e8cfa9ec8b5eb432fa Mon Sep 17 00:00:00 2001
From: Ben Lin <maobin001@msn.com>
Date: 星期二, 22 十月 2024 11:04:10 +0800
Subject: [PATCH] 工艺缓存优化
---
src/views/demo/charts/map/Google.vue | 77 ++++++++++++++++++--------------------
1 files changed, 36 insertions(+), 41 deletions(-)
diff --git a/src/views/demo/charts/map/Google.vue b/src/views/demo/charts/map/Google.vue
index e346296..0d06242 100644
--- a/src/views/demo/charts/map/Google.vue
+++ b/src/views/demo/charts/map/Google.vue
@@ -1,53 +1,48 @@
<template>
<div ref="wrapRef" :style="{ height, width }"></div>
</template>
-<script lang="ts">
- import { defineComponent, ref, nextTick, unref, onMounted } from 'vue';
+<script lang="ts" setup>
+ import { ref, nextTick, unref, onMounted } from 'vue';
+ import { useScript } from '@/hooks/web/useScript';
- import { useScript } from '/@/hooks/web/useScript';
+ defineOptions({ name: 'GoogleMap' });
+
+ defineProps({
+ width: {
+ type: String,
+ default: '100%',
+ },
+ height: {
+ type: String,
+ default: 'calc(100vh - 78px)',
+ },
+ });
const MAP_URL =
'https://maps.googleapis.com/maps/api/js?key=AIzaSyBQWrGwj4gAzKndcbwD5favT9K0wgty_0&signed_in=true';
- export default defineComponent({
- name: 'GoogleMap',
- props: {
- width: {
- type: String,
- default: '100%',
- },
- height: {
- type: String,
- default: 'calc(100vh - 78px)',
- },
- },
- setup() {
- const wrapRef = ref<HTMLDivElement | null>(null);
- const { toPromise } = useScript({ src: MAP_URL });
+ const wrapRef = ref<HTMLDivElement | null>(null);
+ const { toPromise } = useScript({ src: MAP_URL });
- async function initMap() {
- await toPromise();
- await nextTick();
- const wrapEl = unref(wrapRef);
- if (!wrapEl) return;
- const google = (window as any).google;
- const latLng = { lat: 116.404, lng: 39.915 };
- const map = new google.maps.Map(wrapEl, {
- zoom: 4,
- center: latLng,
- });
- new google.maps.Marker({
- position: latLng,
- map: map,
- title: 'Hello World!',
- });
- }
+ async function initMap() {
+ await toPromise();
+ await nextTick();
+ const wrapEl = unref(wrapRef);
+ if (!wrapEl) return;
+ const google = (window as any).google;
+ const latLng = { lat: 116.404, lng: 39.915 };
+ const map = new google.maps.Map(wrapEl, {
+ zoom: 4,
+ center: latLng,
+ });
+ new google.maps.Marker({
+ position: latLng,
+ map: map,
+ title: 'Hello World!',
+ });
+ }
- onMounted(() => {
- initMap();
- });
-
- return { wrapRef };
- },
+ onMounted(async () => {
+ await initMap();
});
</script>
--
Gitblit v1.9.3