- 博客(61)
- 收藏
- 关注
RSS订阅
原创 vue使用高德地图导航路线失败，获取驾车数据失败：INVALID_USER_SCODE(解决方法)
高德地图使用路线导航最近做大屏项目，里面有地图定位，路线导航等方面的功能，在做路线定位是一直都是获取不到导航的路线，经过好长时间的百度看高德api文档终于找到解决方法。解决方法 添加高德地图安全密钥// 添加高德安全密钥 安全密钥是和key一起申请的，可能很多人会忽略掉。他也大有用处// window._AMapSecurityConfig = {// securityJsCode: "‘xxxxxxxx’"// };效果代码<template> <di
2022-04-23 14:52:18
10180
16
原创 vue总结实现流程
一. MVVMMVVM 是 Model - View - ViewModel 的缩写 可以看到他和之前的MVC很像，的确有人称之为一个加强优化版的MVC. 是一种模块化开发代码分层的思想或者框架;MVVM 的优点1、主要目的是分离视图（View）和模型（Model）2、降低代码耦合，提高视图或者逻辑的重用性。3、提高了模块的可测试性模型（Model）: 模型和业务数据绑定，方便数据的使用和传递;视图（View): 视图是应用程序中用户界面相关的部分，是用户看到并与之交互的界面。View
2021-12-16 17:35:53
1226
原创 前端vue从服务器获取当前时间然后累加处理
最近做的一个医院大屏显示的需求，在大屏上需要显示当前实时的时间，在医院的大屏就是医院排队叫号显示的那种大屏，这种大屏不需要登录是通过配置好的连接直接打开的，医院是内网，没有联网。开始是前端直接获取当前实时时间显示。到医院然后实施说，医院是内网，不能获取网络当前时间后来和后端沟通了一下。刚打开大屏是调接口获取当前时间，前端对时间做处理，累加实现时间实时更新，下面是代码。很简单、 created() { this.getRealTimeData(); }, met
2021-11-30 20:21:52
2686
4
原创 vue使用B站开源播放器flv.js和原生video实现视频直播,播放
flv.js<template> <div class="flv_box"> <video id="myvideo" controls autoplay muted></video> <button @click="onClick()">播放</button> <button @click="clickStop()">暂停</button> </div></templ
2020-09-07 11:54:53
3971
原创 vue3组件通信大全
如果父组件是纯 Vue3 写法，子组件混合写法，可以通过 props 接收到 data 和 setup 函数里的属性，但是子组件要是在 setup 里接收，同样只能接收到父组件中 setup 函数里的属性，接收不到 data 里的属性。如果父组件是混合写法，子组件纯 Vue3 写法的话，是接收不到父组件里 data 的属性，只能接收到父组件里 setup 函数里传的属性。inject：在任何后代组件中接收想要添加在这个组件上的数据，不管组件嵌套多深都可以直接拿来用。然后两个组件之间通信的使用。
2025-02-10 16:33:24
272
原创 前端HTML标签 meta中常见的一些属性
问题点在于，如果用户先使用 浏览器翻译插件 默认翻译文档内容，又切换了 项目中的国际化 功能，那么此时就导致文档中的内容出现翻译不准确。通常项目中可能会存在 国际化 的需求，这就意味着用户可以手动选择 当前的语言环境，但除此之外，通过浏览器本身也会存在对应的 翻译插件。这样的方式有利于在发布新版本后，避免通过手动清除浏览器缓存，如果不清除缓存就会加载旧版本的资源。viewport属性用于指定网页的视口设置。description属性用于指定网页的描述信息。copyright属性用于指定网页的版权信息。
2025-02-10 16:20:18
1020
原创 前端实现无感刷新token
对于需要前端实现无痛刷新Token，无非就两种：请求前判断Token是否过期，过期则刷新请求后根据返回状态判断是否过期，过期则刷新。
2025-02-10 16:16:54
331
原创 pnpm的指令和优点
在计算机中我们文件夹中的文件实际上是一个指针，但这个指针并不是直接指向我们在磁盘中存储文件的位置，而是指向一个 inode 块，inode 中存储着文件在磁盘中的各种信息，一般我们的文件都是指向 对应文件的 inode，我们把这类链接成为硬链接，但是还有一种链接，它存储的并不是实际的值，而是另一个硬链接的地址，我们把这类链接成为软链接。可以看到 node_modules 结构非常清晰，但是这个 express 文件夹只是一个软链接, 它的真正存储的地方在图中的 .pnpm 文件夹中。
2025-02-10 16:14:09
561
原创 高德地图通过地理位置转经纬度,报跨域问题解决方法 https://restapi.amap.com/v3/geocode/
高德地图逆地理地址转经纬度
2022-06-14 13:13:55
4346
原创 MySQL数据库查询（二）
2. 统计一下工作岗位的数量？3. 什么是连接查询？3. 连接查询的分类？怎么避免笛卡尔积现象？内连接之等值连接。内连接之非等值连接4.内连接之自连接外连接案例：查询每个员工的上级领导，要求显示所有员工的名字和领导名？三张表，四张表怎么连接？案例：找出每个员工的部门名称以及工资等级，还有上级领导，要求显示员工名、领导名、部门名、薪资、薪资等级？什么是子查询？子查询都可以出现在哪里呢？where子句中的子查询from子句中的子查询select后面出现
2022-05-31 22:45:35
497
原创 Typescript基本使用
记录学习Typescript安装 Typescript: npm install -g typescript原始数据类型BooleanNullUndefinedNumberBigIntStringSymbollet isDone: boolean = false// 接下来来到 numberlet age: number = 10let binaryNumber: number = 0b1111// 之后是字符串，注意es6新增的模版字符串也是没有问题的let f
2022-05-31 17:47:17
189
原创 MySQL数据库查询
1. 导入一下提前准备好的数据：bjpowernode.sql 这个文件中是我提前为大家练习准备的数据库表。怎么将sql文件中的数据导入呢？mysql> source D:\course\03-MySQL\document\bjpowernode.sql注意：路径中不要有中文！！！！2. 关于导入的这几张表？mysql> show tables;+-----------------------+| Tables_in_bjpowernode |+--------------
2022-05-31 17:43:32
396
原创 MySQL卸载和本地数据库登录及基本指令。
MySQL数据库的完美卸载！第一种方式 第一步：双击安装包进行卸载删除。 第二步：删除目录： 把C:\ProgramData下面的MySQL目录干掉。 把C:\Program Files (x86)下面的MySQL目录干掉。 这样就卸载结束了！第二种方式计算机-->右键-->管理-->服务和应用程序-->服务-->找mysql服务MySQL的服务，默认是“启动”的状态，只有启动了mysql才能用。默认情况下是“自动”启动，自动启动表示下一次重启操作
2022-05-31 15:43:36
343
原创 vue 使用高德地图 和 vue-amap高德地图组件库基本使用
最近在做大屏地图项目。之前一直没接触过地图之类的项目，然后在网上搜如何使用。看高德地图的api。和组件库。vue-amap组件库和高德原生的api都差不多也可以混合使用。下面介绍一下基本的引入和使用。高德地图引入使用高德地图在vue中是直接用比较方便不过需要注意写法，他是有异步加载的顺序，可以写个js文件引入到文件中使用export default function MapLoader () { return new Promise((resolve, reject) => { i
2022-04-07 19:07:40
8462
4
原创 vue项目 安装依赖报错 node-sass报错
node安装错误报错比较老的项目，需要维护。安装依赖包是一直报这个错， npm intsall 安装依赖一直失败，到网上查是 node-sass 安装的问题。> core-js@3.6.5 postinstall B:\vue\Code\vue-cars-admin-master\node_modules\core-js> node -e "try{require('./postinstall')}catch(e){}"> ejs@2.7.4 postinstall B:\vu
2022-04-06 19:00:27
2974
2
原创 vue相关知识汇总
前言最近复盘了一下vue相关知识，对vue有了进一步的认识了解（数据绑定、响应式原理、diff算法、一些工作中常用的属性方法是具体怎么实现等），空余时间整理了一下分享给大家，希望对你有所帮助~~~vue 的优点低耦合，视图（View）可以独立于 Model 变化和修改，一个 ViewModel 可以绑定到不同的"View"上，当 View 变化的时候 Model 可以不变，当 Model 变化的时候 View 也可以不变可重用性，你可以把一些视图逻辑放在一个 ViewModel 里面，让很多 vi
2022-02-25 11:45:25
176
原创 前端性能优化
一. css、js 的加载与执行一个网站在浏览器端是如何进行渲染的呢？基本过程1．解析HTML文件，创建DOM树2．解析CSS,形成CSS对象模型3．将CSS与DOM合并，构建渲染树（renderingtree）4．布局和绘制对渲染树上的每个元素，计算它的坐标，称之为布局。浏览器采用一种流方法，布局一个元素只需通过一次，但是表格元素需要通过多次。最后，渲染树上的元素最终展示在浏览器里，这一过程称为“painting”。当用户与网页交互，或者脚本程序改动修改网页时，前文提到的一些操作将会重
2022-01-24 13:12:24
513
原创 Vue3初体验快速上手
认识Vue3性能提升打包大小减少41%。初次渲染快55%, 更新渲染快133%。内存减少54%。使用Proxy代替defineProperty实现数据响应式。重写虚拟DOM的实现和Tree-Shaking。新增特性Composition (组合) APIsetupref 和 reactivecomputed 和 watch新的生命周期函数provide与inject…新组件Fragment - 文档碎片Teleport - 瞬移组件的位置Suspens..
2022-01-10 15:34:42
385
原创 前端数组对象去重的几种方法，拿来即用
工作中有许多地方地方需要前端处理数据，总结了几种数据去重的方法都实验过，可以使用 初始数据 id有相同的需要去重 let person = [ { id: 0, name: "小明" }, { id: 1, name: "小张" }, { id: 2, name: "小李" }, { id: 3, name: "小孙" }, { id: 1, name: "小周" }, { id: 2, na
2021-12-30 13:48:08
5210
2
原创 防抖和节流及案例实现
防抖const input1 = document.getElementById('input1')let timer = nullinput1.addEventListener('keyup', function () { if (timer) { clearTimeout(timer) } timer = setTimeout(() => { // 模拟触发 change 事件 console.log(input1.v
2021-12-12 20:52:00
508
原创 宏任务和微任务的区别
宏任务：DOM 渲染后再触发微任务：DOM 渲染前会触发// 修改 DOMconst $p1 = $('<p>一段文字</p>')const $p2 = $('<p>一段文字</p>')const $p3 = $('<p>一段文字</p>')$('#container') .append($p1) .append($p2) .append($p3)// // 微任务：渲染之前执行（DOM 结构.
2021-12-12 20:45:35
718
原创 前端开发中常用正则表达式
创建js文件，在页面中直接使用/** * 常用正则表达式 */export const regExps = { /** url校验 */ url: new RegExp('^(?!mailto:)(?:(?:http|https|ftp)://|//)(?:\\S+(?::\\S*)?@)?(?:(?:(?:[1-9]\\d?|1\\d\\d|2[01]\\d|22[0-3])(?:\\.(?:1?\\d{1,2}|2[0-4]\\d|25[0-5])){2}(?:\\.(?:[0-
2021-01-13 14:50:30
238
原创 vue 长按图片保存分享
<html><head><title>长按图片保存分享</title><meta name="viewport" content="640, initial-scale=1.0, maximum-scale=1.0,minimum-scale=1.0,user-scalable=0"><script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js"></scr
2020-12-04 13:46:29
1731
原创 深度解析 JavaScript 中call方法原理
一丶深度解析 JavaScript 中call方法原理call 方法是 Function 类原型上的一个公共方法，我们知道所有的函数都是 Function 类的一个实例(对象)，当然，call函数本身也是Function类的一个实例。任何一个函数都可以调用call方法，包括call方法本身。函数调用call方法时，是把函数作为Function的实例也就是对象身份的。function fn1() {}console.log(Function.prototype.call.__proto__ === F
2020-11-19 17:52:05
2483
1
原创 Vue中computed和watch的区别
计算属性computed :支持缓存，只有依赖数据发生改变，才会重新进行计算不支持异步，当computed内有异步操作时无效，无法监听数据的变化3.computed 属性值会默认走缓存，计算属性是基于它们的响应式依赖进行缓存的，也就是基于data中声明过或者父组件传递的props中的数据通过计算得到的值如果一个属性是由其他属性计算而来的，这个属性依赖其他属性，是一个多对一或者一对一，一般用computed5.如果computed属性属性值是函数，那么默认会走get方法；函数的返回值就是属性的属性
2020-09-16 11:17:39
162
原创 webSocket在vue项目中实现获取实时在线人数
//本地服务 http协议 使用 ws var socket = new WebSocket("wss://xxxxxxxxxxxxxxxxx"); // 服务器长链接路径 // 建立 web socket 连接成功触发事件 socket.onopen =function (e) { console.log("连接成功opened", e); }; // 接收服务端数据时触发事件 var that =this socket.onme.
2020-08-28 15:14:48
2022
4
原创 前端之回流（Reflow）与重绘（Repaint）
回流：当我们对 DOM 的修改引发了 DOM 几何尺寸的变化（比如修改元素的宽、高或隐藏元素等）时，浏览器需要重新计算元素的几何属性（其他元素的几何属性和位置也会因此受到影响），然后再将计算的结果绘制出来。这个过程就是回流（也叫重排）。重绘：当我们对 DOM 的修改导致了样式的变化、却并未影响其几何属性（比如修改了颜色或背景色）时，浏览器不需重新计算元素的几何属性、直接为该元素绘制新的样式（跳过了上图所示的回流环节）。这个过程叫做重绘。由此我们可以看出，重绘不一定导致回流，回流一定会导致重绘。硬要比较的
2020-07-21 17:43:29
1122
原创 前端vue组件间通信六种方式（完整版）
方法一、props/$emit 父组件home通过props的方式向子组件About传递， 子组件 向 父组件传值 通过在 子组组件中$emit, 父组件 组件中 v-on 的方式实现一 父组件向子组件传值接下来我们通过一个例子，说明父组件如何向子组件传递值：在子组件About组件中如何获取父组件 home中的数据 users//home.vue父组件<template> <div id="app"> <About:users="users" >
2020-07-10 15:38:45
1994
2
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人