1.根目录html文件引入

<!--引入百度 API,"ak=" 后面一串码是密钥,最好自己申请-->
<script type="text/javascript" src="https://api.map.baidu.com/api?v=2.0&ak=7a6QKaIilZftIMmKGAFLG7QT1GLfIncg"></script>
2.vue页面
methods:
getLocation() {
            var geolocation = new BMap.Geolocation();
            geolocation.getCurrentPosition(function(e){
                if(this.getStatus() == BMAP_STATUS_SUCCESS){
                    var geoc = new BMap.Geocoder()
                    // 百度 geolocation 的经纬度属性不同,此处是 point.lat 而不是 coords.latitude
                    let LocationProvince = e.address.province
                    let LocationCity = e.address.city
                    console.log(LocationProvince,LocationCity)
                }else{
                    this.getStatus();
                }
            })
        },

vue下获得经纬度省市区的更多相关文章

  1. vue 下实现 echarts 全国到省份的地图下钻

    vue 下实现 echarts 全国到省份的地图下钻 项目地址:https://github.com/cag2050/vue_echarts_v3_demo

  2. checked、disabled在原生、jquery、vue下不同写法

          以下是原生和jquery <!DOCTYPE html> <html> <head> <meta http-equiv="Content ...

  3. 浅谈Vue下的components模板

    浅谈Vue下的components模板在我们越来越深入Vue时,我们会发现我们对HTML代码的工程量会越来越少,今天我们来谈谈Vue下的 components模板的 初步使用方法与 应用 我们先来简单 ...

  4. VUE(下)

    VUE(下) VUE指令 表单指令 数据的双向指令 v-model = "变量" model绑定的变量,控制的是表单元素的value值 普通表单元素用v-model直接绑定控制va ...

  5. vue下实现input实现图片上传,压缩,拼接以及旋转

    背景 作为一名前端工作人员,相信大家在开发系统的时候,经常有遇到需要这么一种需求,就是需要为用户保存上传的图片,很多小白遇到这个问题的时候,都会虎躯一震,以为会是一个棘手的问题,当你读完这篇文章的时候 ...

  6. Vue下路由History mode导致页面无法渲染的原因

    用 Vue.js + vue-router 创建单页应用,是非常简单的.使用 Vue.js ,我们已经可以通过组合组件来组成应用程序,当你要把 vue-router 添加进来,我们需要做的是,将组件( ...

  7. 八:Vue下的国际化处理

    p { margin-bottom: 0.25cm; line-height: 120% } 1:首先安装 Vue-i8n npm install vue-i18n --save 注:-save-de ...

  8. Ajax来实现下拉框省市区三级联动效果(服务端基于express)

    //服务端JS代码: //提供服务端的处理 const express = require('express'); const fs = require('fs'); const app = expr ...

  9. vue下拉搜索

    vue版本是1.0.21 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> ...

  10. 八:前端---Vue下的国际化处理

    1:首先安装 Vue-i8n npm install vue-i18n --save 注:-save-dev是指将包信息添加到devDependencies,表示你开发时依赖的包裹. -save是指将 ...

随机推荐

  1. C++关于栈对象返回的问题

    本次实验环境 环境1:Win10, QT 5.12 环境2:Centos7,g++ 4.8.5 一. 主要结论 可以返回栈上的对象(各平台会有不同的优化),不可以返回栈对象的引用. 二.先看看函数传参 ...

  2. 基础教材系列:编译原理——B站笔记

    一.编译器是什么 源程序→预处理器→经过预处理的源程序→编译器→汇编语言程序→汇编器→可重定位的机器代码→链接器/加载器→目标机器代码. 编译器的结构: 与源语言相关:字符流→词法分析器→词法单元流→ ...

  3. elasticsearch使用painless的一些简单例子

    目录 1.背景 2.准备数据 2.1 mapping 2.2 插入数据 3.例子 3.1 (update)更新文档 id=1 的文档,将 age 加 2岁 3.2 (update_by_query)如 ...

  4. Avalonia项目生成银河麒麟操作系统安装包

    1 在项目根目录添加xxx.desktop文件,文件内容: [Desktop Entry] Name=xxx Type=Application Exec=/usr/share/xxx/xxx Icon ...

  5. Flux中的map、flatMap、concatMap的区别

    flatMap.map和concatMap都是在Flux中用于进行数据转换和处理的方法,但它们在处理元素和顺序上有一些区别: map方法: map方法用于对Flux中的每个元素进行一对一的转换. 对于 ...

  6. #线段树,倒序#CF356A Knight Tournament

    题目 分析 要求覆盖必须是第一个覆盖的, 考虑最后一个覆盖的很简单做线段树区间赋值, 那么倒序区间赋值就可以了 代码 #include <cstdio> #include <ccty ...

  7. HMS Core机器学习服务实现同声传译,支持中英文互译和多种音色语音播报

    当用户有跨语种交流或音频内容翻译的需求时,应用需要能自动检测语音内容再输出为用户需要的语言文字. HMS Core机器学习服务提供同声传译能力,同声传译实现将实时输入的长语音实时翻译为不同语种的文本以 ...

  8. keycloak~RequiredActionProvider的使用

    使用场景 RequiredActionProvider,它是在认证过程中,需要当前登录的用户执行个性化的动作:当用户符合条件,就被执行RequiredActionProvider对作,当Require ...

  9. 重新整理 mysql 基础篇————— 索引模型[五]

    前言 简单整理一下索引模型. 正文 对我们开发人员来说,索引感觉非常的重要. 因为索引好用,但是不能多建,因为这影响插入,不能少建,因为这影响读取. 有些为了能够多建索引,通过从多个从库中读取数据,再 ...

  10. flutter 移动应用程序中打开URL

    url_launcher: ^6.2.5   在Flutter中,url_launcher库是用于在移动应用程序中打开URL的常用工具.它允许你通过调用系统的浏览器或其他应用程序来打开指定的URL,比 ...