Vue Amap 是一個基于 Vue.js 和 Amap API 的地圖組件庫，可以幫助開發者輕松地在 Vue 應用中嵌入高德地圖。除了地圖的基本功能外，Vue Amap 還提供了豐富的組件和插件，讓開發者可以快速實現復雜的地圖功能需求。

在使用 Vue Amap 時，常常會遇到需要在地圖中進行搜索的情景。Vue Amap 提供了多種方式實現地圖搜索，以下是其中兩種常用的方式。

1. 使用 Amap SDK 提供的搜索服務

// 首先需要在 Vue 組件中引入 AMap 對象
import AMap from 'vue-amap';
// 然后可以在組件中通過 AMap 對象訪問 Amap SDK 的搜索服務
this.AMap.plugin('AMap.PlaceSearch', function () {
const placeSearch = new AMap.PlaceSearch({
// 搜索結果數量
pageSize: 10,
pageIndex: 1,
// 城市
city: '杭州市',
});
// 根據關鍵字搜索
placeSearch.search('餐廳', (status, result) =>{
console.log('搜索結果：', result);
});
});

上面的代碼中，我們通過引入 AMap 對象和在組件中注冊插件的方式訪問了 Amap SDK 的搜索服務。我們以搜索餐廳為例，通過傳入關鍵字和城市，搜索服務會返回一個包含搜索結果的數組。

2. 使用 Vue Amap 提供的組件

// 在 Vue 組件中引入 Vue Amap 的組件
import { AmapSearch } from 'vue-amap';
// 將 AmapSearch 組件注冊到 Vue 應用中
export default {
components: {
AmapSearch,
},
}
// 在 Vue 模板中使用 AmapSearch 組件

如果不想通過 Amap SDK 直接訪問搜索服務，我們也可以使用 Vue Amap 提供的 AmapSearch 組件來實現搜索功能。AmapSearch 組件提供了常用的搜索選項，用戶只需要傳入相應的參數即可實現搜索功能。

AmapSearch 組件的輸出結果可以通過 slot-scope 屬性綁定的 searchRes 變量來渲染。這個變量是搜索服務返回的結果數組，我們可以通過遍歷數組的方式將搜索結果展示在頁面中。