wxjt-asset-web/src/components/XyMap/index.vue

<template>
  <div>
    <avue-map v-model="map" placeholder="请选择地图"></avue-map>
    <p style="zoom: .85;">{{ value }}</p>
  </div>
</template>

<script>
export default {
  props: {
    value: [String, Object, Array, Number, Boolean],
    resultFormat: {
      type: [String, Object, Array],
      default: () => ['longitude','latitude'] //latitude纬度，longitude经度,formattedAddress地址
    }
  },
  data() {
    return {
      map: {},

    }
  },
  methods: {},
  computed: {},
  watch: {
    map(newVal) {
      if(!newVal) return
      let info = {
        ...newVal,
        latitude: newVal.latitude,
        longitude: newVal.longitude,
      }
      let res = ''
      if(typeof this.resultFormat === 'string') {
        res = info[this.resultFormat]
      }
      if(this.resultFormat instanceof Array) {
        res = this.resultFormat.map(i => info[i])?.toString()
      }
      if(typeof this.resultFormat === 'object' && (!this.resultFormat instanceof Array)) {
        let obj = {}
        for(let key in this.resultFormat) {
          obj[key] = info[this.resultFormat[key]]
        }
        res = obj;
      }
      console.log(res)
      this.$emit('input', res)
    },
    value(newVal) {
      if(typeof this.resultFormat === 'string') {
        this.map[this.resultFormat] = Number(newVal)
      }
      if(this.resultFormat instanceof Array && newVal) {
        let valArr = newVal.split(',')
        this.resultFormat.forEach((i,index) => {
          this.map[i] = Number(valArr[index])
        })
      }
      if(typeof this.resultFormat === 'object' && (!this.resultFormat instanceof Array)) {
        for(let key in this.resultFormat) {
          this.map[key] = Number(newVal[key])
        }
      }

      console.log(this.map)
    }
  }
}
</script>

<style scoped lang="scss">
</style>