vue2.0之Vue Baidu Map 局部注册使用
文档地址: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 局部注册使用的更多相关文章
- Vue Baidu Map局部注册实现和地图绘点
需求:在vue项目中,实现用户选择地图绘点或者通过搜索关键字选点 <template> <div id="home"> <h2>首页地图< ...
- vue Baidu Map --- vue百度地图插件
vue Baidu Map 官网:https://dafrok.github.io/vue-baidu-map/#/zh/start/installation javascript 官网:http:/ ...
- Vue组件全局/局部注册
全局注册 main.js中创建 Vue.component('button-counter', { data: function () { return { count: 0 } }, templat ...
- Vue Baidu Map 插件的使用
最近在做一个项目,技术采用的是Vue.js套餐,有个百度地图的需求,当时,大脑宕机,立马去引入百度地图API,当时想到两种方法,一种是在index.html中全局引入js,此法吾不喜,就采用了第二种异 ...
- Vue2.0学习--Vue数据通信详解
一.前言 组件是 vue.js最强大的功能之一,而组件实例的作用域是相互独立的,这就意味着不同组件之间的数据无法相互引用.组件间如何传递数据就显得至关重要.本文尽可能罗列出一些常见的数据传递方式,如p ...
- Vue2.0源码学习(6) - 组件注册
组件注册 前言 在 Vue.js 中,除了它内置的组件如 keep-alive.component.transition.transition-group 等,其它用户自定义组件在使用前必须注册.在开 ...
- vue2.0 vs vue
vue2.0相比vue1.0 有哪些改变,今天总结了一下 vue2.0组件中 template 不在支持代码片段 //vue1.0组件中template写法 <template> < ...
- Vue2.0总结———vue使用过程常见的一些问题
Vue目前的的开发模式主要有两种:1.直接页面级的开发,script直接引入Vue2.工程性开发,webpack+loader或者直接使用脚手架工具Vue-cli,里面的文件都配置好了 webpack ...
- 使用Vue Baidu Map对百度地图实现输入框搜索定位
前端时间需要在页面的输入框输入地址,搜索并在百度地图上获取选定结果的坐标,前端使用了Vue + Element-ui,地图方面直接使用了封装好的百度地图vue组件-vue-baidu-map ...
随机推荐
- python regularexpress
这个正则表达式,我还真没有接触过,在python首次学习 //test.py 1 import re 2 3 print (re.match('www', 'www.myweb.com').span( ...
- OEMCC 13.2 安装部署
需求:安装部署OEM 13.2 环境:两台主机,系统RHEL 6.5,分别部署OMS和OMR: OMS,也就是OEMCC的服务端 IP:192.168.1.88 内存:12G+ 硬盘:100G+ OM ...
- sqli-labs(十四)(宽字节注入)
数据库使用gbk编码的时候,会将两个字符合并成一个中文. 写在前面吧,对php的代码审计也会有帮助 直接使用 set character_set_client=gbk 或者是常见的mysql_quer ...
- LeetCode167.两数之和II-输入有序数组
给定一个已按照升序排列 的有序数组,找到两个数使得它们相加之和等于目标数. 函数应该返回这两个下标值 index1 和 index2,其中 index1 必须小于 index2. 说明: 返回的下标值 ...
- java中的锁之AbstractQueuedSynchronizer源码分析(一)
一.AbstractQueuedSynchronizer类介绍. 该抽象类有两个内部类,分别是静态不可继承的Node类和公有的ConditionObject类.AbstractQueuedSynchr ...
- 1.安装Python3和PyCharm
一.安装Python3 1.进入官网:www.python.org 2.下载(可以选择你自己的电脑系统版本,我这里是win7 64位) 3.然后点击XXX.exe傻瓜式安装 4.配置环境变量 [右键计 ...
- sitecore系列教程之Sitecore个性化-配置文件,模式和角色
这是利用Sitecore规则引擎实现数字化转换的三部分系列的第二部分.阅读上一篇文章,通过为您的个性化体验定义内容策略来设置基础. Sitecore有一个非常强大的规则引擎,可以帮助推动个性化的用 ...
- xpath ,css
https://docs.scrapy.org/en/latest/intro/tutorial.html xpath @选择属性 .当前目录下选择 //任意路径选择 /bookstore/book ...
- Applegate 方法使用
1. - (void)application:(UIApplication *)application didRegisterUserNotificationSettings:(UIUserNotif ...
- 【2017-03-23】CSS基础:内联样式
CSS:层叠式样式表 1.对层标签整体进行操作 <div style="width:200px;height:200px;background-color:blue"> ...