<div v-if="state.showBmapContainer">
    <BmapContainer
        :bmapKey="state.bmapKey"
        @child-confirm-clicked="handleChildConfirmClicked"
        @child-cancel-clicked="handleChildCancelClicked"
    />
</div>

// 导入
import BmapContainer from '/@/components/xmmap/bmapContainer.vue'
// getBmapKey获取百度地图key，可替换成自己的方法
import { getBmapKey } from '/@/api/backend/xmmap/bmap'

const state = reactive({
    showBmapContainer: false,
    bmapKey: '',
})
// 获取百度地图key，可替换自己的接口
getBmapKey().then((res) => {
    state.bmapKey = res.data
})
// 弹窗打开百度地图
const openMapPickPop = () => {
    state.showBmapContainer = true
}
// 点击确认获取当前位置信息
const handleChildConfirmClicked = (data: { showBmapContainer: boolean; poiname: any; poiaddress: any; longitude: any; latitude: any }) => {
    console.log('百度地图获取当前位置信息', data)
    state.showBmapContainer = data.showBmapContainer
}
// 点击取消关闭地图弹窗
const handleChildCancelClicked = (data: { showBmapContainer: boolean }) => {
    state.showBmapContainer = data.showBmapContainer
}

{
    "protectedFiles": ["web/src/components/xmmap/bmapContainer.vue"]
}