百度地图 - 基础学习(5): 地图事件、逆/地址解析

百度地图 - 基础学习(5): 地图事件、逆/地址解析：template

<template>
  <div class="el-col el-col-24">
    <div class="el-col el-col-24 font-size16">
      <div class="el-col el-col-24">
        <div class="color-b2aead">当前鼠标点击位置地址：div>
        <div class="color-568dfd">
          <span v-if="currentAddress !== null && currentAddress !== 'getLost'">
            {{
              currentAddress.length
                ? currentAddress
                : "艾玛，你娃掉海里了，快捞起来！"
            }}
          span>
          <span v-if="currentAddress === 'getLost'"
            >年轻人你已经迷失了自我，快回去吧！span
          >
        div>
      div>
      <div class="el-col el-col-24">
        <div class="color-b2aead">当前鼠标点击位置经纬度为：div>
        <div class="color-568dfd">
          <span style="margin-right: 10px">
            {{
              currentPoint
                ? currentPoint.lng > 0
                  ? "东经：" + Math.abs(currentPoint.lng)
                  : "西经：" + Math.abs(currentPoint.lng)
                : ""
            }}
          span>
          <span>
            {{
              currentPoint
                ? currentPoint.lat > 0
                  ? "北纬：" + Math.abs(currentPoint.lat)
                  : "南纬：" + Math.abs(currentPoint.lat)
                : ""
            }}
          span>
        div>
      div>
    div>

    <div class="el-col el-col-24 font-size16">
      <div class="el-col el-col-24">
        <div class="color-b2aead">地图中心点变更为：div>
        <div class="color-568dfd">
          <span v-if="centerAddress !== null && centerAddress !== 'getLost'">
            {{
              centerAddress.length
                ? centerAddress
                : "艾玛，你娃掉海里了，快捞起来！"
            }}
          span>
          <span v-if="centerAddress === 'getLost'"
            >年轻人你已经迷失了自我，快回去吧！span
          >
        div>
      div>
      <div class="el-col el-col-24">
        <div class="color-b2aead">当前地图中心位置经纬度为：div>
        <div class="color-568dfd">
          <span style="margin-right: 10px">
            {{
              centerPoint
                ? centerPoint.lng > 0
                  ? "东经：" + Math.abs(centerPoint.lng)
                  : "西经：" + Math.abs(centerPoint.lng)
                : ""
            }}
          span>
          <span>
            {{
              centerPoint
                ? centerPoint.lat > 0
                  ? "北纬：" + Math.abs(centerPoint.lat)
                  : "南纬：" + Math.abs(centerPoint.lat)
                : ""
            }}
          span>
        div>
      div>
    div>

    <el-row class="el-col el-col-24 queryPar-form-wrapper">
      <el-form
        class="el__form-queryPar"
        ref="ruleForm"
        label-position="left"
        label-width="75px"
        :model="ruleForm"
        :inline="true"
      >
        <el-row class="el-col el-col-24 address-search">
          <el-form-item class="inlineBlock-formItem" prop="parameterAddress">
            <input
              type="text"
              id="parameterAddress"
              size="20"
              placeholder="请输入定位地址关键字"
            />
          el-form-item>
          <el-button
            class="el-button-fun inlineBlock-formItem"
            @click.stop="positioningAddress()"
            >地址定位el-button
          >
        el-row>

        <el-row class="el-col el-col-24 queryPar-button-wrapper">el-row>
      el-form>
    el-row>
  div>
template>

百度地图 - 基础学习(5): 地图事件、逆/地址解析：script