- 博客(54)
- 收藏
- 关注
RSS订阅原创 封装上传组件，提供各种校验、显示预览、排序等功能
相关能力- 提供图片、音频、视频的预览功能- 提供是否为空、文件类型、文件大小、文件数量、图片宽高校验- 提供图片回显功能- 提供在达到数量限制和禁用时不显示文件选择器的能力- 提供点击上传和拖拽上传- 提供文件排序功能
2025-01-03 16:25:42
806
原创 MAX_VALUE 和 MAX_SAFE_INTEGER的区别及相关知识
MAX_VALUE是所能表示的最大数值，1.7976931348623157e+308MAX_SAFE_INTEGER是最大安全整数，9007199254740991
2024-08-29 15:44:57
772
原创 JS正则表达式学习与实践
6、字符出现的次数范围匹配”{n,m}“：表示一个字符出现的次数范围，可以在该字符的末尾，将它出现的次数写进大括号 {min,max} 中，如 {1,4};5、字符出现至少次数匹配”{n,}“：表示一个字符至少出现的次数，可以在该字符的末尾，将它出现的次数写进大括号 {min,} 中，如 {1,};4、字符出现次数匹配”{n}“：表示一个字符出现的确切次数，可以在该字符的末尾，将它出现的次数写进大括号 {} 中，如 {1};4、字符范围”[a-z]“、”[0-9]“：匹配方括号字符范围内的字符；
2024-08-02 10:07:51
758
原创 将Knife4j所展示请求参数和响应参数转化为TS类型声明
目标：在浏览器控制台输入js代码，将读取页面所展示的请求参数和响应参数，将他们转化为TS的类型声明，并在控制台中输出出来。
2024-03-29 16:55:21
774
原创 像uniapp image标签一样对图片进行缩放和裁剪
在使用uniapp开发时觉着image标签的mode属性非常的使用，符合多种开发场景，并且最近有在整理`object-fit`和`object-position`的笔记，正好利用css属性按照image标签对于图片的缩放和裁剪处理，总结一套自己的经验。
2024-03-20 16:15:29
3226
原创 使用CSS的object-position实现图片在img标签中的定位
在CSS中，`object-position`属性它允许我们精确地控制替换元素（如``、``等）内容在其容器内的位置。通过指定水平和垂直方向的偏移量，可以轻松地调整元素内容在容器内的起始点，实现精准定位。
2024-03-18 18:58:51
2195
原创 让图片适应标签的CSS object-fit属性
在实际的项目运行过程中，可能出现运营人员上传的文件与预期的图片尺寸不同的情况，为了解决这一问题可以使用 object-fit 属性，对嵌入的图像（以及其他替代元素，如视频）做相应的变化，更加精确地控制图像的展示效果，从而满足多样化的设计需求。
2024-03-18 18:30:23
2686
原创 基于高德地图JS API实现Vue地图选点组件
基于高德地图JS API2.0实现一个搜索选择地点后返回给父组件位置信息的功能，同时可以进行回显
2024-03-15 11:08:45
2040
2
原创 通过Node.js获取高德的省市区数据并插入数据库
将使用高德地图API https://restapi.amap.com/v3/config/district?parameters进行行政区域查询，API详细文档可看。
2023-10-10 16:06:03
1695
原创 二次封装element-plus上传组件，提供校验、回显等功能
提供能力- 提供图片、音频、视频的预览功能- 提供是否为空、文件类型、文件大小、文件数量、图片宽高校验- 提供图片回显功能，并保证回显的文件不会重新上传- 提供达到数量限制不显示element自带的加号
2023-08-14 14:23:09
1612
1
原创 基于ali-oss实现不同类型文件上传不同的bucket
基于ali-oss实现不同类型文件上传不同的bucket，并根据大小判断使用直接上传还是分片上传
2023-08-04 17:09:43
566
原创 js设置默哀用全局灰度
通过动态的新增/删除link标签，使js能操作是否引入css。如果现在时间大于了之前保存的灰度结束时间。如果新的灰度时间区间囊括了现在时间。如果之前没有获取过灰度时间区间。则重新获取灰度时间的区间。则将全局样式加入灰色滤镜。
2023-06-20 15:45:42
556
原创 js实现继承属性和方法
挂载在函数内部的方法，实例内部会复制构造函数的方法挂载在原型上的方法，不会去复制。挂载在内部和原型上的方法都是可以通过实例去调用的一般来说，如果需要访问构造函数内部的私有变量，我们可以定义在函数内部，其他情况我们可以定义在函数的原型上在函数外定义的方法，只能用类调用构造函数内函数名直接调用报错函数外函数名直接调用正常执行函数外 prototype上函数名直接调用报错构造函数内实例化对象调用正常执行函数外实例化对象调用报错函数外 prototype上。
2023-05-03 17:38:56
975
原创 使用spc2实现项目的多环境自动化部署
1、使用cross-env修改系统常量，使程序知道接下来的操作要想那个服务器自动部署2、使用ssh2操作服务器，将服务器上原有的项目改名，并放入记录文件夹3、使用scp2将打包后的文件发送到对应的服务器的指定位置
2022-12-28 20:17:32
577
原创 使用inputmode改变移动端键盘弹出的类型
使用原因：需求是同时兼容移动端和PC端的输入，输入框数量多且绑定不同的对象，原本考虑使用vantUI的数字键盘，但是实际使用起来问题比较多，偶然间发现了inputmode这个属性，它可以改变移动端唤起拟态键盘的方式。可以直接查看官网说明提示：以下是本篇文章正文内容，下面案例可供参考。
2022-12-20 17:35:19
2145
1
原创 从URL中获取参数后，修改URL，并且不跳转页面
需求：通过统一认证登录页面跳转过来，会通过URL的形式携带Token，需要从URL中获取到Token并存储到本地。问题：由于使用Hash的路由模式，会在原始URL的末尾拼接"/#/"，导致也一直被展示在URL上，十分不美观。方案：通过history.replaceState的方式修改URL，不会产生页面跳转的问题。
2022-10-26 09:41:57
2040
原创 保存滚动位置的实现方法
有的时候从列表页面进入详情页面再返回列表页面，即使使用了keep-alive缓存列表页，也会导致列表页面你的滚动位置发生了变化。两个页面高度不一致导致页面跳转的时候滚动条位置发生了改变；keep-alive不会缓存滚动条的位置。为了解决这个问题我们需要手动的保存列表页面的滚动条位置，并再切换回列表页面的时候滚动到保存的位置。
2022-10-01 17:12:27
2371
原创 nvm与nrm
nvm（Node Version Manager） 是一种用于管理多个主动节点.js版本的工具。它可以使用简单的命令在本地下载任何远程长期支持 （LTS） 版本的 Node.js。可以直接从命令行在 Node.js 的多个版本之间轻松切换。nrm（NPM Registry Manager）是一个npm源管理器，它允许用户快速地在不同的npm源之间切换，以提高npm包的下载速度和稳定性。。
2022-09-19 15:45:35
32
原创 grid常用属性及属性值介绍
本文章是使用的总结，以便于复习使用，如有错误希望指出。grid布局方式真的好用，无愧于是最强大的CSS布局方案。不适合无基础的人看，本文章更像是笔记。提示以下是本篇文章正文内容，下面案例可供参考。...
2022-07-23 00:35:31
2947
原创 js结束循环的三种方式对比（break、continue、return区别）
break实际有两种用法，分别为：1.它可用于终止 switch 语句中的一个 case。2.当 break 语句出现在一个循环内时，循环会立即终止，且程序流将继续执行紧接着循环的下一条语句。如果是多层循环，break 语句会跳出所在的当前整个循环，到外层代码继续执行。break不仅可以结束其所在的循环，还可结束其外层循环，但一次只能结束一种循环continue 会结束本次循环，直接开始下一次循环。对于 for 循环，执行continue 语句后自增语句仍然会执行，对于 while 和 do…whil
2022-06-11 17:44:14
6097
5
原创 Vue组件间传值的几种方式
1、使用v-bind和props的组合实现父向子传值在父组件可以通过"v-bind:参数名"或者":参数名"的形式传递参数，参数值可以为任何数据类型，并且在子组件中不能更改父组件传递过来的数据。<!-- 父组件部分,向组件level1传递两个参数，test和temp --><template> <level1 :test="1" :temp="'abc'"></level1></template>在子组件使用props接收父组件传递过
2022-05-11 13:52:10
2440
原创 /deep/和::v-deep与:deep()
在vue中，我们为了避免父组件的样式影响到子组件的样式，会在 <style> 标签上设置scoped属性，这样它的 CSS 只会应用到当前组件的元素上，即使父组件中有跟子组件相同的class名称或者选择器的时候，也不会影响到子组件的样式。但是有的时候我们需要，我们需要在一个组件中改变被引入组件的样式，直接使用class命名改变样式没有任何反应，这种情况就需要使用/deep/或::v-deep了。在vue3.0之前可使用/deep/深度选择器进行样式的更改//单选框修改未点击时的边框颜色/
2022-04-18 11:11:25
20233
原创 微信支付和支付宝支付所用应用签名如何获取
微信支付官网说明：微信支付官网链接签名工具下载地址具体流程（已uniapp为例）1、首先需要生成安卓证书，确定好包名并打包APK。证书生成方式如下keytool -genkey -alias 证书别名 -keyalg RSA -keysize 2048 -validity 36500 -keystore 证书名.keystore证书生成详细教程2、将APK安装至手机，将签名工具安装至手机。3、输入包名获取签名如果报错，请确定输入包名是否正确，与打包时的输入的包名是否相同，如果不确定AP
2022-04-13 20:10:52
2786
原创 地图信息窗口点击事件触发methods中的方法
核心代码将methods里边的方法赋值给全局变量// 将methods里边的方法赋值给全局变量window.mapCallback = this.mapCallbackmethods:{ mapCallback(IMEI, type) { //业务处理 }}实现过程1、点击弹出窗体//初始化infoWindowvar infoWindow = new TMap.InfoWindow({ map: this.mapEntity, position: new T
2022-03-04 10:52:54
547
原创 隐私政策提示框内容中的链接使用本地 html 页面地址（androidPrivacy.json中所用）
隐私政策提示框内容中的链接使用本地 html 页面地址（androidPrivacy.json中所用）
2022-02-26 15:57:57
6569
23
原创 uniapp唤起APP
实现思路设置UrlSchemes代码实现const u = navigator.userAgent;// 获取运行环境对象const versions = { trident: u.indexOf('Trident') > -1, //IE内核 presto: u.indexOf('Presto') > -1, //opera内核 webKit: u.indexOf('AppleWebKit') > -1, //苹果、谷歌内核 gecko: u.indexOf('Geck
2022-01-06 11:25:24
1839
原创 uniapp获取手机唯一标识IMEI、MAC、UUID
// #ifdef APP// 导入Java类。Networklnterface类表示一个由名称和分配给此接口的IP地址列表组成的网络接口const net = plus.android.importClass('java.net.NetworkInterface');// 搜索具有指定名称的网络接口const wlan0 = net.getByName('wlan0');// 获得网卡的硬件地址const macByte = wlan0.getHardwareAddress();let ..
2021-12-23 11:15:21
11902
7
原创 uniapp打包微信小程序识别二维码
1、image标签长按识别实现（微信版本>2.7.0）为image标签设置 show-menu-by-longpress="true"可实现识别二维码（微信个人码、微信群码、企业微信个人码、 企业微信群码与企业微信互通群码）<image show-menu-by-longpress="true"></image>uniapp官方文档链接微信小程序官方文档链接2、通过预览图片再长按实现通过uni.previewImage(OBJECT)实现，该方法可以在新页面中全屏
2021-12-12 20:49:00
3886
原创 VUE中侦听器（监听属性）的属性值
watch介绍watch用来监听每一个属性的变化。watch这个对象里面都是函数，函数的名称是data中的属性名称，watch中的函数不需要调用。当属性发生改变那么就会触发watch函数。watch.handler方法，watch 方法其实默认写的就是handler。watch.deep属性，默认值是 false。普通的watch方法无法监听到对象内部属性的改变，如需要监听内部属性则需要设置为true。watch.immediate属性，默认值是 false。当immediate为false时，
2021-12-11 00:28:53
1010
原创 JavaScript中堆与栈的区别
在理解堆与栈这两个概念时，需要放到具体的场景下去理解。一般情况下有两层含义：（1）内存操作场景下，堆与栈表示两种内存的管理方式。（2）数据结构场景下，堆与栈表示两种常用的数据结构。1、内存操作场景栈由操作系统自动分配和释放，用于存放简单的数据段，占据固定大小的空间，比如基本数据类型（Number、String、Boolean……）和函数的参数值等。堆由开发人员自主分配和释放，若不主动释放，程序结束时由浏览器回收，用于存储引用类型（引用类型的变量实际上保存的不是变量本身，而是指向内存空间的指针）。
2021-12-02 00:43:16
1933
原创 JavaScript中深克隆（深拷贝）的三种实现方式
由于Object类型与Array类型是引用类型，而引用类型在变量间的相互赋值是将指向内存的指针赋予过去，这样就会导致，当改变b的数据会将a的数据一同改变。而在实际的开发过程中，有很多时候需要将两个变量间的关联断开，所以需要用到深克隆断开这个联系。1、使用延展操作符（…）实现深克隆这种方式是最简单且便捷的一种方式，但是只能深克隆一层，第二层的引用依然指向原来的位置。2、使用JSON实现深克隆这种方式也比较简便，并且可以实现多层的深克隆，但是无法复制function，无法适用全部场景。3、使用
2021-11-26 16:08:01
11717
现代js是否还是单线程执行的呢
2023-03-26
TA创建的收藏夹 TA关注的收藏夹
TA关注的人