利用arcgis api实现自定义查询

在这里使用下拉菜单和输入框两个部分实现地图中位置的查询

搜索界面

 <div class="search" style="z-index: 2000">
      <div class="search-select">
        <select name="" id="select" class="select">
          <option value="">请选择---</option>
          <option
            v-for="item in kindList"
            v-bind:key="item.value"
            v-text="item.name"
          ></option>
        </select>
      </div>

      <div class="spilt"></div>

      <input
        type="text"
        name="find"
        id="find"
        class="search-find"
        placeholder="请输入内容"
      />
      <button id="do-find" class="do-find"></button>

      <!-- <div class="btn_find">
                <button></button>
            </div> -->
    </div>

js方法定义

需要引入Search 类

import Search from "@arcgis/core/widgets/Search";

// 添加搜索组件
      var searchWidget = new Search({
        view: mapView,
      });

      const btn_search = document.getElementById("do-find");
      const input_find = document.getElementById("find");

      btn_search.addEventListener("click",function(){
          const select_value = document.getElementById("select");
          // alert(select_value.value);
          
          dosearch(select_value.value + input_find.value);
      });
      function dosearch(value){
          searchWidget.search(value);
      }
      // 搜索组件添加结束