SaaS-lib/lib/component/form/map/map1.vue

<!-- @format -->

<template>
  <div>
    <NsGMap ref="nsGMap" @change="coordinates" v-bind="props" v-if="mapKey.type === 'gmap'" />
    <NsTMap ref="nsTMap" @change="coordinates" v-bind="props" v-if="mapKey.type === 'tmap'" />
  </div>
</template>
<script lang="ts">
  export default {
    name: 'NsMap',
  };
</script>
<script lang="ts" setup>
  import { ref, reactive, onMounted, useAttrs, computed } from 'vue';
  import NsGMap from './mapV2.vue';
  import NsTMap from './tmap.vue';
  const nsGMap: any = ref(null);
  const nsTMap: any = ref(null);
  let mapKey = ref({
    type: '',
    url: '',
  });
  // console.log(useAttrs());
  const props = defineProps({
    titleName: {
      type: String,
      default: '位置信息',
    },
    longitude: {
      type: String,
      default: '',
    },
    latitude: {
      type: String,
      default: '',
    },
    defaultAddress: {
      type: String,
      default: '',
    },
    longLat: {
      type: Object,
    },

    //新的写法
    defaultValue: {
      type: Array,
      default: () => {
        return [];
      },
    },
    viewOnly: {
      type: Boolean,
      default: false,
    },
    value: {
      type: Array,
      default: () => {
        return [];
      },
    },
    fieldMap: {
      type: Object || Array,
      default: () => {
        return [];
      },
    },
    formModel: {
      type: Object || Array,
    },
    // ...useAttrs(),
  });

  const getBindValue = computed(() => {
    return {
      ...props,
      ...useAttrs(),
    };
  });
  console.log(getBindValue);
  // emit
  const emit = defineEmits(['change']);
  const coordinates = (data: any) => {
    emit('change', [data[0], data[1], data[2]]);
  };

  const getMapKey = () => {
    if (window.localStorage.getItem('mapKey')) {
      try {
        let mapobj = JSON.parse(window.localStorage.getItem('mapKey'));
        mapKey.value = mapobj;
      } catch (error) {}
    } else {
      mapKey.value = {
        type: 'gmap',
        url: '',
      };
    }
  };

  onMounted(() => {
    getMapKey();
  });
</script>