vue 通过百度地图实现地位

1. 通过npm 安装百度地图插件 npm install vue-baidu-map -s
2. 到百度地图开放平台申请ak ：https://lbsyun.baidu.com/
3. 开始创建页面

4.        <el-form-item label="定位坐标" prop="address" required>
                    <div class="dffn wdi-600 mpp">
                        <el-input class="wdi-515 mb-10 mr-10" placeholder="请选择定位坐标"
                                  v-model="form.address"></el-input>
                        <div>
                            <el-button type="primary" @click="searchPoi">检索</el-button>
                        </div>
   
                        <div class="mp-box" v-if="showMr">
                            <div class="lh-40 mt-10">
                                <el-button type="primary" size="mini" @click="showMr = fasle">
                                    关闭结果页
                                </el-button>
                            </div>
                            <div class="lh-40" v-for="(item, index) in addrs" :key="index"
                                 @click="selectPoint(item)">
                                <i class="el-icon-location color-409EFF"></i>
                                {
       {item.title + "(" + item.address + ")"}}
                            </div>
                        </div>
                    </div>
   
                    <baidu-map class="map" :center="center" :zoom="zoom" @ready="handler"
                               :scroll-wheel-zoom="true"
                               @click="clickEvent"