文档地址:https://dafrok.github.io/vue-baidu-map/#/zh/start/usage

局部注册

<template>
<baidu-map id="mapContent" class="bm-view" ak="YOUR_APP_KEY" :center="center" :zoom="zoom" @ready="handler">
<bm-marker :position="{lng: 116.404, lat: 39.915}" :dragging="true">
   </bm-marker>
</baidu-map>
</template>
<script>
import BaiduMap from 'vue-baidu-map/components/Map/Map.vue'
    import BmMarker from 'vue-baidu-map/components/overlays/Marker.vue'
export default {
      data() {
        return {
          center: {lng: 116.404,lat: 39.915},
           zoom: 15
        }
      },
      components: {
          BaiduMap,
         BmMarker
       },
} </script>
备注
1.独立组件均存放在 vue-baidu-map/components 文件夹下.
2 从node_modules/vue-baidu-map/components/index.js下面找对应插件如下图:
3.components下必须添加对应插件

vue2.0之Vue Baidu Map 局部注册使用的更多相关文章

  1. Vue Baidu Map局部注册实现和地图绘点

    需求:在vue项目中,实现用户选择地图绘点或者通过搜索关键字选点 <template> <div id="home"> <h2>首页地图< ...

  2. vue Baidu Map --- vue百度地图插件

    vue Baidu Map 官网:https://dafrok.github.io/vue-baidu-map/#/zh/start/installation javascript 官网:http:/ ...

  3. Vue组件全局/局部注册

    全局注册 main.js中创建 Vue.component('button-counter', { data: function () { return { count: 0 } }, templat ...

  4. Vue Baidu Map 插件的使用

    最近在做一个项目,技术采用的是Vue.js套餐,有个百度地图的需求,当时,大脑宕机,立马去引入百度地图API,当时想到两种方法,一种是在index.html中全局引入js,此法吾不喜,就采用了第二种异 ...

  5. Vue2.0学习--Vue数据通信详解

    一.前言 组件是 vue.js最强大的功能之一,而组件实例的作用域是相互独立的,这就意味着不同组件之间的数据无法相互引用.组件间如何传递数据就显得至关重要.本文尽可能罗列出一些常见的数据传递方式,如p ...

  6. Vue2.0源码学习(6) - 组件注册

    组件注册 前言 在 Vue.js 中,除了它内置的组件如 keep-alive.component.transition.transition-group 等,其它用户自定义组件在使用前必须注册.在开 ...

  7. vue2.0 vs vue

    vue2.0相比vue1.0 有哪些改变,今天总结了一下 vue2.0组件中 template 不在支持代码片段 //vue1.0组件中template写法 <template> < ...

  8. Vue2.0总结———vue使用过程常见的一些问题

    Vue目前的的开发模式主要有两种:1.直接页面级的开发,script直接引入Vue2.工程性开发,webpack+loader或者直接使用脚手架工具Vue-cli,里面的文件都配置好了 webpack ...

  9. 使用Vue Baidu Map对百度地图实现输入框搜索定位

    前端时间需要在页面的输入框输入地址,搜索并在百度地图上获取选定结果的坐标,前端使用了Vue + Element-ui,地图方面直接使用了封装好的百度地图vue组件-vue-baidu-map     ...

随机推荐

  1. leetcode34. Find First and Last Position of Element in Sorted Array

    二分查找不只是查找,还可以根据需求添加条件进行查找,比如这个题,左端点的条件就是边界点或者小于target,右端点的条件就是!=size()或者大于.根据这个找到查找的条件

  2. 有关于异常捕获点滴,plus我也揭揭java的短

    ▄︻┻┳═一『异常捕获系列』Agenda: ▄︻┻┳═一有关于异常捕获点滴,plus我也揭揭java的短 ▄︻┻┳═一根据异常自定义处理逻辑([附]java异常处理规范) ▄︻┻┳═一利用自定义异常来 ...

  3. RSA加解密 公钥加密私钥解密 公加私解 && C++ 调用openssl库 的代码实例

    前提:秘钥长度=1024 ============================================== 对一片(117字节)明文加密 ========================= ...

  4. Linux.超级管理员root-密码破解

    Linux.超级管理员root-密码破解 环境: 我是在虚拟机中安装的Linux,然后进行破解的.实体机,应该也是可以的,但我没有尝试过.如果你有实体机,试试吧... 又不要钱~ 在系统启动的时候,会 ...

  5. Mongo数据两表关联创建视图示例

    表tblCard: {"cNo":"11","oRDate":ISODate("2017-08-01T00:00:00.000+0 ...

  6. caffe-ssd运行create_data.sh的时候报错:SSD from caffe.proto import caffe_pb2 ImportError: No module named caffe.proto

    在用voc2007和voc2012的数据训练基于caffe的SSD模型的时候,我们需要将图片数据转换成lmdb格式,运行脚本文件是SSD源码里面提供的create_data.sh(具体位置在$CAFF ...

  7. would you please...could you please...两句区别是什么?

    Could you please 是can you please 更为礼貌.委婉的说法,并不是过去式,是“能否麻烦你……”.“请你……”的意思,更侧重“能否”及客观情况:回答时要注意,eg:A:“Co ...

  8. Azure IoT 技术研究系列2-设备注册到Azure IoT Hub

    上篇博文中,我们主要介绍了Azure IoT Hub的基本概念.架构.特性: Azure IoT 技术研究系列1-入门篇 本文中,我们继续深入研究,做一个起步示例程序:模拟设备注册到Azure IoT ...

  9. Redis的key和value大小限制

    Redis的key和value大小限制        今天研究了下将java bean序列化到redis中存储起来,突然脑袋灵光一闪,对象大小会不会超过redis限制?不管怎么着,还是搞清楚一下比较好 ...

  10. 20165305 苏振龙《Java程序设计》第二周学习总结

    代码托管(ch2,ch3) 脚本截图 教材内容总结 类型.变量与运算符 基本类型 整数(short.int.long) 字节(byte) 浮点数(float/double) 字符(char)将一个数字 ...