- 博客(50)
- 资源 (2)
- 问答 (1)
- 收藏
- 关注
原创 vue实现websocket实时短消息通知
websocket就是通过服务器向客户端推送消息,客户端也可以主动向服务器发送消息,是真正的双向平等对话,是一种长连接,只需要通过一次请求进行初始化。一般在登录后系统初始化的时候建立连接,使用vue的全局路由导航守卫可轻松实现。
2024-11-06 14:46:25
964
原创 vue实现天地图电子围栏
一、文档vue3javascript WGS84、GCj02相互转换天地图官方文档注册登录然后申请应用key,通过CDN引入<script src="http://api.tianditu.gov.cn/api?v=4.0&tk=您的密钥" type="text/javascript"></script>二、分析所谓电子围栏1、就是在地图商通过经纬度将点标注出来,然后将这些点连起来渲染为一个面2、然后在此基础上支持编辑即添加删除以及拖拽3、在每次操
2024-11-06 14:26:12
897
原创 nvm 报错 Could not retrieve https://npm.taobao.org/mirrors/node/index.json.
1、进入nvm安装目录(例如:C:\Users\默认账户\AppData\Roaming\nvm)中找到settings.txt文件,把以下配置复制进去,覆盖原先的镜像域名。因为淘宝的镜像域名更换,npm.taobao.org域名HTTPS证书到期更换为npmmirror.com,故此导致安装依赖报错。
2024-03-28 15:45:10
3016
4
原创 js数组去重常见方法
3、使用reduce()方法:通过reduce()方法遍历数组,将元素存储在一个临时对象中,每次遇到重复元素时将其跳过,最后返回所有不重复元素的数组。4、使用Map:通过Map对象可以将数组元素作为键,通过Map的键唯一性特性去重,然后再将Map对象转换为数组。1、使用Set:将数组转换为Set对象,Set对象会自动去除重复元素,之后再将Set对象转换为数组。2、使用filter()方法:通过filter()方法遍历数组,返回仅包含首次出现的元素的新数组。
2024-03-20 17:59:12
416
原创 css相邻元素边框重合问题,解决方案
我的解决方案是在宽度上下手,根据观察,发现一行三列,实际导致确实的是两个边框的大小,那么将这两个边框的大小平分到每行三列模块的开宽度内即可解决,其他情况下,由此推导。给每个元素设置margin-top以及margin-left为负的边框。
2024-03-07 11:02:06
2634
1
原创 解决element的select组件创建新的选项可多选且opitions数据源中有数据的情况下,回车不能自动选中创建的问题
最近开发项目使用element-plus库内的select组件,其中有提供一个创建新的选项的用法,但是发现一些小问题,在此记录。
2023-08-19 16:39:32
1453
原创 关于windows如何安装以及使用切换nodejs多版本
https://github.com/coreybutler/nvm-windows/releases,下载.zip后缀的这个文件,下载后解压安装即可。1、先把系统已有的node卸载掉,也可不卸载,但是以防没必要的冲突,尽量还是卸掉。nvm是一个简单的bash脚本,它是用来管理系统中多个已存的Node.js版本。3、配置镜像源,从安装目录中找到settings.txt文件将一下配置复制进去。4、查看是否安装成功(安装完成后稍微等候一下)4、查看nodejs版本是否切换成功。5、查看已安装nodejs版本。
2023-06-17 15:33:35
2565
原创 vue2以及vue3 父组件接收多个子组件参数的同时,接收自身参数的方法
vue2以及vue3 父组件接收多个子组件参数的同时,接收自身参数的方法
2023-03-16 10:22:57
936
原创 有关在Vue中JS如何在H5移动端如何调起第三方地图软件(高德、腾讯、百度)
有关在Vue中JS如何在H5移动端如何调起第三方地图软件(高德、腾讯、百度)
2021-12-07 10:41:47
7375
1
原创 js中Object.freeze()函数的作用
官方文档Object.freeze() 方法可以冻结一个对象。一个被冻结的对象再也不能被修改;冻结了一个对象则不能向这个对象添加新的属性,不能删除已有属性,不能修改该对象已有属性的可枚举性、可配置性、可写性,以及不能修改已有属性的值。此外,冻结一个对象后该对象的原型也不能被修改。freeze() 返回和传入的参数相同的对象。let obj = { a: 1, b: 2}// 将obj对象进行冻结Object.freeze(obj)// 给obj添加属性。输出查看,发现并未添加上obj.
2021-11-16 12:02:48
5075
原创 记录有关父元素flex: 1,子元素高度设置百分比不生效的问题(谷歌内核的浏览器中)
使用 navigator.userAgent.toLowerCase() 西安获取一下内核信息,查询内核版本是否处于至少处于chrome49以下参考: https://segmentfault.com/q/1010000020919894原因分析: 由于在低版本的谷歌内核的浏览器中若父元素是使用flex1自动占满的剩余空间则此时父元素的高度就是缺省即默认的压根就没设置高度,故而导致子元素设置百分比高度的时候因找不到父元素的高度从而导致设置的高度不生效的问题解决方法:升级浏览器内核给父元素一个固
2021-08-30 16:44:13
1216
原创 有关input框在vue中无论如何都可以获取到焦点
一、需求扫码枪键入数据二、分析因扫描枪本质上其实就是键盘键入数据,最简单的方法就是写一个input框并使其获取到焦点,直接扫码后键入数据即可在测试中这个input框可以显示,调用该组件时手动点击获取焦点即可,但是上线后这个输入框时要定位到屏幕外的就算是可以显示在屏幕中肯定不能要求用户去点击,故而若能找到一个方法可以在调用时就使其获取到焦点,不就可以解决了嘛给当前input框绑定ref亦或者是绑定Id值,而后 this.$refs.inputref.focus() // 或者 d
2021-07-26 16:01:11
1513
原创 Error: Redirected when going from “/***“ to “/***“ via a navigation guard
解决方法将下方代码复制进router/index.js中即可const originalPush = VueRouter.prototype.pushVueRouter.prototype.push = function push(location, onResolve, onReject) { if (onResolve || onReject) return originalPush.call(this, location, onResolve, onReject) return or
2021-06-22 17:50:50
1022
原创 有关微信小程序保存图片到相册以及当用户拒绝授权保存图片后如何重新拉起授权的详细解析
一、准备阶段保存图片到系统相册文档 uni.saveImageToPhotosAlbum({ filePath: '', // 必须是本地路径 success: () => { console.log('保存成功'); }, fail:() => { console.log('保存失败') }});注意:此处的 filePat 必须是本地图片路径!!!! 疑问1:当用户第一次点击保存按钮调用了该接口,会弹出提示授权弹框,此时若点击了取消按钮,那么当用户第二次再点击
2021-06-21 19:11:47
3335
原创 有关vue cli4版本如何关闭eslint语法检查
一、找到根目录下.eslintrc文件,在其中找到@vue/standard将其注释掉二、如若还不可以,就在根目录下创建vue.config.js文件夹,将下方代码复制进入即可module.exports = { lintOnSave: false, // 关闭eslint校验 devServer: { overlay: { // 关闭eslint校验 warning: false, errors: false }, }};...
2021-06-15 09:50:07
388
1
原创 [Vue warn]: Property or method “toJSON“ is not defined on the instance but referenced during render.
如图: 主要输出this或者window控制台直接报错, [Vue warn]: Property or method “toJSON” is not defined on the instance but referenced during render. Make sure that this property is reactive, either in the data option, or for class-based components, by initializing the prope
2021-05-10 10:39:30
4178
1
原创 同时按需引入vant和element库
一、 Vant官方地址1. 通过 npm 安装Vue 2 项目,安装 Vant 2:npm i vant -SVue 3 项目,安装 Vant 3:npm i vant@next -S2.按需引入组件安装插件 npm i babel-plugin-import -Dbabel.config.js中配置如下module.exports = { plugins: [ ['import', { libraryName: 'vant', lib
2021-05-08 14:12:37
3348
原创 echarts引入后报错“TypeError: Cannot read property ‘init‘ of undefined“
解决方法一:切换低版本echarts解决方法二: 无论是通过CDN还是通过npm安装引入的echarts在其引入项目的地方将import echarts from ‘echarts’
2021-03-16 11:56:35
604
原创 vue项目echarts通过cdn或npm引入
1、 vue版本号: 2.6.112、 vue-cli版本号: 4.5.113、 通过CDN的方式引入3 3.1 、线上链接1.首先先在public文件夹下的html页面中引入<script crossorigin="anonymous" integrity="sha512-RuUMLxuB8daxj+iqjuwA7u2lFFFQNlbnFnerb0FPhfZ761E0Wn6wD4f5vZskYgbxu+wSu36vfFHCUDaKaHHhUQ==" src="http://lib
2021-03-16 11:43:29
15633
5
原创 有关JavaScript自动将金额处理并显示为元、万元、亿等
首先分析金额的单位可分为元、拾、佰、仟、万、亿、兆等分别表示为1、10、100、1000、10000、100000000、1000000000000去掉拾、佰、仟后元、万、亿、兆等可得规律兆为亿的10000倍、亿为万的10000倍、万为元的10000倍则可根据此规律若得到金额数值小于10000的金额可直接使用元来表示、若是得到的金额数值大于等于10000的金额则可循环遍历将当前金额每次除以10000直至金额数值小于10000时,可根据循环次数得到当前金额的单位function handleMon.
2021-03-09 15:01:42
3103
原创 uni多端(H5和微信小程序)获取经纬度以及位置信息(当前城市)
1.首先使用uni.getlocation获取到当前的经纬度信息uni.getlocation开发者文档封装uni.getlocation// 获取当前经纬度位置promise封装const getMyLocation = function() { let promise = new Promise((resolve, reject) => { uni.getLocation({ //获取当前的位置坐标 type: 'wgs84', success: function(r
2020-12-21 19:10:32
5597
9
原创 vue子组件设置默认值为Object或者Array时,报错Invalid default value for prop “XXX“: Props with type Object/Array
vue子组件设置默认值为Object或者Array时,报错Invalid default value for prop “XXX”: Props with type Object/Array,翻译为[Vue warn]:属性“XXX”的默认值无效:类型为Object/Array的道具必须使用工厂函数返回默认值。如下此类问题原因在于Props在设置默认值default时若值类型为Object或者Array时不能直接default而是需要使用函数通过return将值返回出来才可以,如下1. 错误写法li
2020-12-09 15:08:08
1903
原创 js之ios与Android设备之间的兼容问题
由于在ios平台下的webapp中时间戳的获取方式不支持传统的写法所以在ios设备中获取时间戳就不可使用new Date(‘2020-11-26 11:52:00’).getTime()的方式,只需要value.replace(/-/g, ‘/’)将其中的-替换为/,new Date(‘2020/11/26 11:52:00’).getTime()这种方式安卓iso都可使用...
2020-11-26 11:57:22
676
原创 js计算相差时间
/** * 使用传入的两个时间的毫秒差来计算时间 * startDate: 开始时间;格式: YYYY-MM-DD 或者 YYYY-MM-DD hh:mm:ss * endDate: 结束时间;格式: YYYY-MM-DD 或者 YYYY-MM-DD hh:mm:ss * */1.计算相差天数// 若是要计算从开始时间到结束时间共几天的话需要加1const DifferDayTime = function(startDate, endDate) { // 一天等于86400000毫秒 re
2020-11-13 14:56:57
2739
原创 Uniapp项目实战之H5端运行到外置浏览器存在跨域问题的解决
一、Uniapp在官方api中已经明确表示H5 端本地调试时会遇到跨域问题,其实官方api已经明确给出了解决方案,在此记录以防踩坑,官方解决方案二、官方推荐使用方案一::使用HBuilderX内置浏览器;方案二:配置webpack-dev-server代理;方案三:给浏览器安装跨域插件,禁止浏览器报跨域;方案一内置浏览器用起来总是有点感觉不提舒服,方案三可能插件不起作用,这里我们使用方案二1.使用HBuilderX新建uniapp项目,找到manifest.json文件然后找到源码视图模块而后再在其中
2020-09-16 10:16:12
6134
2
原创 CSS面试之元素水平垂直居中
所有适用于未知元素大小的都可以适用于已知元素大小一、关于元素在屏幕窗口居中1.已知元素宽高直接给该元素position:fixed; 固定定位,而后left和top都50%,最后直接margin left和top负的宽高的一半即可.CenterWindow { height: 100px; width: 100px; background-color: aquamarine; position: fixed; left: 50%; top: 50%; mar
2020-06-05 23:28:34
154
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人