自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(43)
  • 收藏
  • 关注

原创 unable to access ‘https://gitee.com/geosys/ha-teramap.git/‘: The requested URL returned error: 403

报错:unable to access ‘https://gitee.com/geosys/ha-teramap.git/’: The requested URL returned error: 403。点进来这篇博客,你肯定也遇到这个问题了,听兄弟一句劝,问问领导有没有拉你进仓库哈哈哈哈!今天遇到大坑,平时git用的好好的,突然push代码的时候报这个错!解决方法:领导没拉我进仓库哈哈哈哈。

2024-04-23 17:47:40 115

原创 执行window.location.reload总是有弹窗出现如何解决

执行window.location.reload总是有弹窗出现如何解决。

2024-04-09 14:39:18 114

原创 el-tree与el-popover配合使用避免事件冒泡

【代码】el-tree与el-popover配合使用避免事件冒泡。

2024-04-07 18:02:37 508

原创 报错 ValidationError: Progress Plugin Invalid Options

【代码】报错 ValidationError: Progress Plugin Invalid Options。

2024-04-01 12:18:58 295 1

原创 Google OAuth 2.0授权登录并获取用户信息

你会发现在跳转回去的url上多了许多参数,通过url获取这些参数,这些参数的作用是通过他们获取access_token信息(参数中最重要的就是code了)已获授权的 JavaScript 来源:代表从那些网址发起的Google验证登录可以被通过,可以用自己的项目地址。获取用户信息的:https://www.googleapis.com/oauth2/v2/userinfo。已获授权的重定向 URI:代表输入完成Google账号和正确的密码后跳转的路径。输入完正确的账号和密码后,这里列出主要使用的api。

2024-03-28 10:58:17 577

原创 de_modules/.vite/deps/gifler.js?t=1710386602390&v=99750686‘ does not provide an export named ‘defaul

在vue文件中引入gifler.js的时候:报错The requested module ‘/node_modules/.vite/deps/gifler.js?4.在需要用到gifler的vue文件中写上这行代码declare const gifler: any;注意:这个错误在vue3+ts项目中产生的,具体原因也不是很清楚,不过这样确实能解决问题哈哈哈。2.把下载的js文件放到本地文件夹中例如:/src/assets中。找了很多方法也没解决最后用大招了——如图:我已经安装了gifler。

2024-03-14 11:52:26 254

原创 统计字符串中每个字符串出现的次数

给定一个字符串,统计每个字符出现的次数。

2024-03-13 16:45:32 157

原创 三分钟搞定普通函数和箭头函数的this指向问题

obj.getAge()是一个普通函数,根据口诀:“谁调用这个函数,函数的this就指向谁”因此此时的getAge()this指向obj,再分析其中的箭头函数的this,根据口诀:“箭头函数定义时的执行上下文的this是谁,箭头函数的this就指向谁”这里的执行上下文就是函数getAge的函数作用域,因此函数getAge()的this指向谁,其内部的箭头函数也指向谁-----所以obj.getAge()执行输出2001。

2024-03-13 15:41:09 126

原创 js中“==” 和“===”的区别

” 是两种比较操作符,它们的区别在于它们进行比较时对数据类型的处理方式不同。因此,无论是对于基本数据类型还是引用数据类型,都应该根据实际需要选择使用"=” 的行为略有不同,但本质上遵循相同的规则:比较的是引用的地址。=" 进行比较,除非你明确需要类型转换的情况下再使用"=="。对于引用数据类型(如对象、数组)来说,“在JavaScript中,“

2024-03-13 14:22:26 292

原创 Must be called at the top of a `setup` function (at vue-i18n.js?v=e5cb6efe:268:17)

这个错误提示表明在Vue.js的i18n插件中,i18n实例的某个方法应该在setup函数的顶部调用,但是它却在其他地方被调用了。直接在ts文件中引入vue-i18n中的t函数会报错Must be called at the top of a。1.新建一个language文件夹。然后就可以尽情的使用t函数了——2.新建index.ts文件。3创建i18n实例并导出。4在main.ts中使用。

2024-03-11 10:34:14 533

原创 openlayer实现切换底图功能

在 OpenLayers 中,如果您想要将新添加的图层放在当前地图中的所有图层的第一个位置,可以使用 insertAt() 方法来实现。需要注意的是,insertAt() 方法的第一个参数是插入的位置,可以是任何数字,表示新的图层应该插入到当前图层集合的哪个位置。在这个示例中,我们通过 getLayers() 方法来获取当前地图中的所有图层,并使用 insertAt() 方法将新的图层对象插入到第一个位置。使用上述方法,您可以将新的图层添加到当前地图中所有图层的第一个位置,以实现切换底图的功能。

2024-03-06 14:50:00 240

原创 vue-draggle拖拽以后松开复原问题

拖拽完成后一松手,元素的位置自动复原(有些需求需要这样做,有些需求是bug)

2024-02-27 12:57:39 180

原创 vue3+ts+vite打包后静态资源404无法加载js和css

vite 打包生成的文件如果直接放在服务器中是可以正常访问的,但是本地直接访问打包生成index.html文件就会提示以下问题。主要:打包静态文件必须是根路径,否则放到服务器找不到静态资源(同理于webpack中的publicPath 的配置)在vite.config.ts中设置:base: "./"具体代码如下。问题1:访问的文件不存在,主要是因为路径配置问题。解决:在 vite.config.js文件中配置。访问的文件不存在,主要是因为路径配置问题。再次打包问题解决——

2024-02-20 09:38:41 1162

原创 高频前端面试题汇总之代码输出结果篇

高频前端面试题汇总之代码输出结果篇前言:代码输出结果是面试中常考的题目,一段代码中可能涉及到很多的知识点,这就考察到了应聘者的基础能力。在前端面试中,常考的代码输出问题主要涉及到以下知识点:异步编程、事件循环、this指向、作用域、变量提升、闭包、原型、继承等,这些知识点往往不是单独出现的,而是在同一段代码中包含多个知识点。所以,笔者将这些问题大致分为四类进行讨论。这里不会系统的阐述基础知识,而是通过面试例题的形式,来讲述每个题目的知识点以及代码的执行过程。如果会了这些例题,在前端面试中多数代码输出问题

2024-01-11 09:39:46 1014

原创 高频前端面试题汇总之手写代码篇

思路:将传入的对象作为原型。

2024-01-11 09:39:00 842

原创 高频前端面试题汇总之前端性能优化篇

是指一种通过互联网互相连接的电脑网络系统,利用最靠近每位用户的服务器,更快、更可靠地将音乐、图片、视频、应用程序及其他文件发送给用户,来提供高性能、可扩展性及低成本的网络内容传递给用户。

2024-01-11 09:37:45 892

原创 高频前端面试题汇总之浏览器原理篇

CSRF 攻击指的是跨站请求伪造攻击,攻击者诱导用户进入一个第三方网站,然后该网站向被攻击网站发送跨站请求。如果用户在被攻击网站中保存了登录状态,那么攻击者就可以利用这个登录状态,绕过后台的用户验证,冒充用户向服务器执行一些操作。CSRF 攻击的本质是利用 cookie 会在同源请求中携带发送给服务器的特点,以此来实现用户的冒充。

2024-01-11 09:36:44 898

原创 高频前端面试题汇总之计算机网络篇

超文本传输安全协议(Hypertext Transfer Protocol Secure,简称:HTTPS)是一种通过计算机网络进行安全通信的传输协议。HTTPS经由HTTP进行通信,利用SSL/TLS来加密数据包。HTTPS的主要目的是提供对网站服务器的身份认证,保护交换数据的隐私与完整性。HTTP协议采用明文传输信息,存在信息窃听信息篡改和信息劫持的风险,而协议TLS/SSL具有身份验证信息加密和完整性校验的功能,可以避免此类问题发生。安全层的主要职责就是对发起的HTTP请求的数据进行加密操作和。

2024-01-11 09:35:35 844

原创 高频前端面试题汇总之React篇(下)

react-redux 数据传输∶ view–>action–>reducer–>store–>view。view 上的AddClick 事件通过mapDispatchToProps 把数据传到action —> click:()=>dispatch(ADD)action 的ADD 传到reducer上reducer传到store上 const store = createStore(reducer);

2024-01-11 09:33:41 850

原创 高频前端面试题汇总之React篇(上)

(1)受控组件在使用表单来收集用户输入时,例如等元素都要绑定一个change事件,当表单的状态发生变化,就会触发onChange事件,更新组件的state。这种组件在React中被称为受控组件,在受控组件中,组件渲染出的状态与它的value或checked属性相对应,react通过这种方式消除了组件的局部状态,使整个状态可控。react官方推荐使用受控表单组件。可以通过初始state中设置表单的默认值每当表单的值发生变化时,调用onChange事件处理器。

2024-01-11 09:32:53 979

原创 高频前端面试题汇总之Vue篇(下)

(1)param方式传递的方式:在path后面跟上对应的值1)路由定义//在APP.vue中<router-link :to="'/user/'+userId" replace>用户</router-link>//在index.js},2)路由跳转// 方法1:<router-link :to="{ name: 'users', params: { uname: wade }}">按钮</router-link// 方法2:// 方法3:3)参数获取 通过获取传递的值。

2024-01-11 09:31:53 902

原创 高频前端面试题汇总之Vue篇

高频前端面试题汇总之Vue篇1. Vue的基本原理当一个Vue实例创建时,Vue会遍历data中的属性,用 Object.defineProperty(vue3.0使用proxy )将它们转为 getter/setter,并且在内部追踪相关依赖,在属性被访问和修改时通知变化。 每个组件实例都有相应的 watcher 程序实例,它会在组件渲染的过程中把属性记录为依赖,之后当依赖项的setter被调用时,会通知watcher重新计算,从而致使它关联的组件得以更新。 2. 双向数据绑定的原理Vue.js

2024-01-11 09:29:38 801

原创 高频前端面试题汇总之JavaScript篇(下)

/ 处理逻辑})回调函数有一个致命的弱点,就是容易写出回调地狱(Callback hell)。// 处理逻辑// 处理逻辑// 处理逻辑})})})// 处理逻辑})// 处理逻辑})// 处理逻辑})以上的代码虽然看上去利于阅读了,但是还是没有解决根本问题。嵌套函数存在耦合性,一旦有所改动,就会牵一发而动全身嵌套函数一多,就很难处理错误当然,回调函数还存在着别的几个缺点,比如不能使用try catch捕获错误,不能直接return。

2024-01-11 09:28:18 741

原创 高频前端面试题汇总之JavaScript篇(上)

a.length;// 3// "ABC"在访问时,JavaScript 将'abc'在后台转换成,然后再访问其length属性。JavaScript也可以使用Object也可以使用valueOfif (!a) {答案是什么都不会打印,因为虽然包裹的基本类型是false,但是false被包裹成包装类型后就成了对象,所以其非值为false,所以循环体中的内容不会运行。一个拥有 length 属性和若干索引属性的对象就可以被称为类数组对象,类数组对象和数组类似,但是不能调用数组的方法。

2024-01-11 09:27:15 799

原创 高频前端面试题汇总之CSS篇

以 iPhone XS 为例,当写 CSS 代码时,针对于单位 px,其宽度为 414px & 896px,也就是说当赋予一个 DIV元素宽度为 414px,这个 DIV 就会填满手机的宽度;而如果有一把尺子来实际测量这部手机的物理像素,实际为 1242*2688 物理像素;经过计算可知,1242/414=3,也就是说,在单边上,一个逻辑像素=3个物理像素,就说这个屏幕的像素密度为 3,也就是常说的 3 倍屏。

2024-01-11 09:26:10 951

原创 高频前端面试题汇总之HTML篇

不同的渲染模式会影响浏览器对 CSS 代码甚⾄ JavaScript 脚本的解析。它必须声明在HTML⽂档的第⼀⾏。浏览器渲染页面的两种模式(可通过document.compatMode获取,比如,语雀官网的文档类型是。

2024-01-11 09:24:27 965

原创 常见面试题总结

JAVASCRIPT部分📙说说JavaScript数据类型JavaScript中的数据类型主要有8中,分别是7种基本数据类型以及1种引用数据类型:Null Undefined Boolean Number BigInt String Symbol 和 Object。JavaScript的类型系统松散,没有严格类型要求,因此我们需要借助typeOf来判断数据类型。typeOf除了可以判断这8种数据类型,也可以判断函数类型,虽然函数本质是一个对象,但是它具有自己特有 的属性。但是typeOf运算符也存在一定

2024-01-11 09:14:27 852

原创 vue3+ts自定义指令v-move实现盒子自由拖动

2.注意示例代码的HTML结构,我是将v-move绑定到整个盒子上,通过firstElementChild取到header。1.注意这里我们是按住拖动header区域实现整个盒子的移动(大部分需求是这样的)CSS样式自己定义就行了。

2024-01-10 17:00:12 423

原创 vue3+ts+openlayers实现卷帘效果

3.改变拉杆的位置时,记录变量随拉杆变化的值(拉杆距离左侧的百分比)1.加载layer的时候通过裁剪只加载一部分。2.设置一个变量记录当前卷帘图层所占的百分比。

2024-01-10 16:45:35 441

原创 vue3+ts+openlayers实现热力图

随着地理信息系统(GIS)的发展,热力图成为了一种常见的数据可视化方式,用于展示密度或者权重分布。OpenLayers 提供了强大的地图功能和丰富的插件,其中之一就是热力图插件。接下来,你需要定义热力图的数据源,可以是本地的 JSON 文件,也可以是远程的数据接口。OpenLayers 的热力图插件是一个基于 Canvas 的图层,它可以根据提供的数据创建热力图效果。热力图插件可以根据权重值的不同,在地图上呈现不同的颜色和强度。热力图是一种有效的数据可视化方式,可以帮助我们更好地理解数据的分布和权重。

2024-01-05 18:54:50 553

原创 vue3+ts+openlayers矢量图高亮

加载geogson鼠标移入获取要素给要素设置高亮样式。

2024-01-05 18:39:16 378

原创 vue3+ts+openlayers实现overlayer叠加层

OpenLayers 中的 Overlay 是一个可视化容器,用于在地图中的某个位置显示与地图控件、图层和要素不直接关联的信息。Overlay 可以包含 HTML 内容和其他内容,如图像和表单输入。在 OpenLayers 中,Overlay 是一个独立的类,它不是在地图上的单独图层,而是与地图一同呈现的。若您想要在地图上添加一个 Overlay,则需要通过调用 ol.Overlay 类来创建它,并将其添加到地图上。

2024-01-05 18:12:32 479

原创 vue+openalyers实时显示鼠标坐标组件

封装了一个实时显示鼠标坐标的组件供大家参考。

2023-12-22 11:37:05 401

原创 vue+openlayers实现流动线效果(js源码导出方法直接复制使用即可生效)

2.FillColor 线段填充色(这里指的是整个线段的填充色 默认:#00A2E8)3.lineDashColor 小线段的颜色 (流动线的颜色 默认:#FFFFFF)在生成要素之后将该要素作为参数传入该方法(也可以传参改变样式,这里就是用默认配置了)

2023-12-22 10:57:44 683 2

原创 opeanlayer的modify实现只改变线段顶点(不允许新增线段上的点)

遇到一个奇怪的需求!openlayers的draw绘制,测量有时候会使用到modify允许改变图形的形状,但今天遇到的需求是:“这是由六个点组成的线(蓝色的)正常情况下我们给地图添加midify交互,地图上的线和点都是可以随意改变位置和形状的这里就不多说了哈!简单吧,哈哈哈哈哈哈——

2023-12-19 12:26:31 485

原创 快速理解虚拟dom(TypeScript版附简易虚拟dom源码)

通过继承我们可以在Vue类中拿到并使用其父类也就是Dom类中的三个方法,这里我们主要用到的是Dom类的render函数。在类中定义三个方法分别是:创建真实节Dom点的方法,填充真实Dom节点内容的方法,渲染函数。事先准备的html文件定义一个id为app的div。

2023-12-13 14:10:37 375

原创 TypeScript中方法的重写与重载

当我们在使用 TypeScript 编写代码时,经常会遇到需要在子类中重写父类方法或者实现方法重载的情况。本文将详细介绍 TypeScript 中方法的重写(override)与重载(overload),并提供相应的代码和例子。

2023-12-13 11:17:54 597

原创 npm install时出现gyp ERR stack Error Could not find any Python installation to use

总结:使用nvm来管理node.js的版本很方便,这样就可以根据自己的需要来回切换node.js版本. 一般来说,你换一下版本较低的node和npm 为题就解决了!5.如果想删除某node.js版本的话,输入命令行nvm uninstall node版本号(例如:nvm uninstall 12.17.0)即可删除对应版本。2.找到这里了 你的有可能和我的长的不一样,因为我这里是nvm版本的,我已经用nvm把bug改好了。可以得到你现在node的位置,按照这个位置找到nodejs文件。

2023-12-12 18:12:10 1283

原创 Vue常见事件修饰符总结

在 Vue 中,事件修饰符允许我们对事件处理程序的行为进行修改和优化,以便更好地处理用户交互。本篇博客将介绍 Vue 中常用的事件修饰符,包括简化事件按键、停止事件冒泡、阻止默认行为等等,并提供示例代码以便更好地理解和应用。

2023-12-07 17:36:41 1013

原创 三分钟理解promise(附简易版promise源码)

在 JavaScript 中,Promise是一种非常重要的异步编程的方法。它可以进行串行或并行的异步操作,并且提供更加简洁和可读性高的代码。本篇博客将简要介绍Promise的概念、用法、重要特性以及一些常见的应用场景。

2023-12-06 18:02:02 744

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除