Vue中如何使用高德地图,面试前端

63 阅读3分钟

ES6

  • 列举常用的ES6特性:

  • 箭头函数需要注意哪些地方?

  • let、const、var

  • 拓展:var方式定义的变量有什么样的bug?

  • Set数据结构

  • 拓展:数组去重的方法

  • 箭头函数this的指向。

  • 手写ES6 class继承。

微信小程序

  • 简单描述一下微信小程序的相关文件类型?

  • 你是怎么封装微信小程序的数据请求?

  • 有哪些参数传值的方法?

  • 你使用过哪些方法,来提高微信小程序的应用速度?

  • 小程序和原生App哪个好?

  • 简述微信小程序原理?

  • 分析微信小程序的优劣势

  • 怎么解决小程序的异步请求问题?

开源分享:docs.qq.com/doc/DSmRnRG… 2.main.js中的配置


key申请地址教程:准备-入门-教程-地图 JS API | 高德地图API

// 高德离线地图

import VueAMap from 'vue-amap';

Vue.use(VueAMap);

VueAMap.initAMapApiLoader({

// 高德key

key: 'd6eabbd08f89ccfb74278b36ab6342567', // 自己到官网申请,我随便写的

// 插件集合 (插件按需引入)

plugin: ['AMap.Autocomplete', 'AMap.PlaceSearch', 'AMap.Scale', 'AMap.OverView', 'AMap.ToolBar', 'AMap.MapType', 'AMap.PolyEditor', 'AMap.CircleEditor', 'AMap.MarkerClusterer'],

v: '1.4.15', // 我也不知道为什么要写这个,不写项目会报错,而且我随便写的,跟我下载的版本对应不了

uiVersion: '1.0.11' // ui版本号,也是需要写,不配置不加载,

})

3.页面中使用


// 地图配置项

initmapFn() {

var _this = this;

// 创建地图,同时给地图设置中心点、级别、显示模式、自定义样式等属性

_this.map1 = new AMap.Map("mapChart", {

resizeEnable: true, //是否监控地图容器尺寸变化

zoom: 3, // 缩放级别

center: [113.3245904, 23.1066805], //中心点坐标

});

//插件依旧写在回调函数内,通过AMap.plugin方法按需引入插件,第一个参数是插件名,第二个是在plugin回调之后使用插件功能。

AMap.plugin(["AMap.ToolBar", "AMap.Scale", "AMap.OverView"], function () {

_this.map1.addControl(new AMap.ToolBar());

_this.map1.addControl(new AMap.Scale());

_this.map1.addControl(new AMap.OverView({ isOpen: true }));

});

_this.map1.clearMap();// 清除所有的覆盖物信息

// 创建 infoWindow 实例

// _this.map1.setFitView();

},

// 地图标注

onMarkerMap(data) {

if (data[0]) {

data.forEach((element, index) => {

if (element.lng) {

let marker = new AMap.Marker({

//在回调函数里面创建Marker实例,添加经纬度和标题

position: new AMap.LngLat(element.lng, element.lat), //添加经纬度

offset: new AMap.Pixel(-13, -30), // 偏移量

// title: "广州塔", // 鼠标移上去时显示的内容

// 可以自定义标记点显示的内容,允许插入html字符串

// content: "

广州塔Content

",

最后前端到底应该怎么学才好?

如果你打算靠自己摸索自学,那么你首先要了解学习前端的基本大纲,这是你将要学习的主要内容,理解以及掌握好这些内容,便可以找到一份初级的前端开发工作。你还需要有一套完整的前端学习教程,作为初学者最好的方式就是看视频教程学习,初学者容易理解接受。

不要选择买书学习,这样的方式没有几个人能学会,基本都是看不下去书,也看不懂书。如果喜欢看书的学弟,可以买一些经典的书籍作为辅助即可,主要还是以看教程为主。每天抽出固定几个小时学习,做好长期学习的准备。学习编程并不是每天光看视频,你学习编程最重要的目的是为了编写软件产品,提供给大众使用,所以用手写出代码实现功能才是我们要做的事情。

开源分享:【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

在这里插入图片描述

在这里插入图片描述

在这里插入图片描述

在这里插入图片描述