自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

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

原创 uni-app App端实现文字语音播报(Ba-TTS)

最近在遇到消息提示语音播放出来,查了一圈文档发现并没有自带api后面想起支付宝收钱播报,不受限与系统环境和版本环境(后面查阅他是音频实现的)如果是由安卓端需要语音播放功能-直接使用Ba-TTs救急(需要付费20元)

2024-05-21 22:09:46 219

原创 uni-app+vue3 +uni.connectSocket 使用websocket

最近在uni-app+vue3+websocket实现聊天功能,在使用websocket还是遇到很多问题这次因为是app手机应用,就没有使用websocket对象,使用的是uni-app的uni.connectSocket为了方便测试这次用的是node.js一个简单的dom,来联调模拟发数据,过程有意思。

2024-05-07 21:21:29 633 4

原创 vue 使用iframe标签切换不同项目,实现步骤(互相嵌套,高度不适应(底部出现白条-随着切换越来越大)传值取值(免登录),内容空白缓存问题)

最近在开发中,由于是合作开发。双方已经有自己的前后端代码,最终需要整合代码上线测试由于模块功能不同,双方ui并没有提前统一设计风格,并且已经开发完毕。前后端如果直接合并到对方项目(前端-有各种冲突-后端鉴权-业务场景不一样)导致.......后来最好的解决办法就是,通过iframe标签带参数来回切换对方项目。

2024-02-11 10:27:40 1603

原创 vue-使用echarts+echarts-gl实现某个省份地区地图3d可视化

最近在开发中遇到一个需求,需要把一个地区地图变成3d感觉悬浮在大屏中间配合业务需求其实echarts配合三方库就可以实现这个效果,具体细节需要自己调整。

2024-01-19 20:29:18 1481 1

原创 vue-element-table表格实现每一条数据绑定定时器实现倒计时或者持续时间

最近在开发中遇到一个需求,每一条数据前端计算处理时间,或者是倒计时时间。第一表格不可能展示所有数据,所以我们需要当前时间和数据库开始时间获取一个初始值。第二我们需要把定时器持续时间绑给每一条数据中,方便展示,和操作时候传递给后端存储。这样一来就解决这个需求,并且不管展示多少数据都不会出错,而且用户体验感较好.

2024-01-19 20:19:06 1115

原创 芋道前端框架上线之后发现element-ui的icon图标全部乱码

最近发现线上有人反映图标全部是乱码,登录上去看确实乱码,刷新就好最后一顿搜,发现是sass版本不兼容导致的图标乱码问题。

2023-12-21 22:05:36 613

原创 vue-内网,离线使用百度地图(地图瓦片图下载静态资源展示定位)

最近发现很多小伙伴都在问内网怎么使用百度地图,或者是断网情况下能使用百度地图吗后面经过一番研究,主要难点是,正常情况下我们是访问公网百度图片,数据,才能使用内网时访问不了百度地图资源时就会使用不了,如果我们能把我们需要数据下载到本地,自己访问自己,那这个问题就可以解决我们可以使用地图下载器下载我们需要的瓦片图数据,使用serve运行起来,这样内网和断网就可以使用了遗憾的是只能基本展示,定位。不能使用百度地图api-类,因为百度地图类和api都是通过http请求来实现的。

2023-12-21 21:39:33 4458 12

原创 datav-轮播排名-对数据进行处理

对于大屏需求我们排名数据轮播也是经常需要用到的需求,datav也是给我们提供了不是说我们自己不能写,而是提供好的轮子比我们自己 写的,更全面,更周到,没有特殊需求的话,使用datav配置一下完成这个是真的快,处理一下数据就可以了。

2023-12-11 21:46:47 624 2

原创 datav-实现轮播表,使用updateRows方法-无缝衔接加载数据

最近在做大屏需求的时候,遇到一个轮播数据的需求,查看datav文档发现确实有这个组件但这个组件只提供了一次加载轮播的例子,虽然提供了轮播加载数据updateRows方法但是文档并没有触发事件,比如轮播完数据触发事件,加载完数据事件-这些都没有说明关键时我们要解决谁来判断数据轮播完了,来触发这个事件,请求接口,加载第二页数据。

2023-12-11 21:36:54 1921 4

原创 element-ui DatePicker 日期选择器-控制选择精确到时分秒-禁止选择今天之前-或者今天之后日期### 前言

最近在使用芋道框架时候,后端使用生成代码,时间因为类型问题,只能是时间戳,否则为空(1970-)前端其实很简单只要在日期选择器把类型改成时间错即可,但根据业务需求需要精确到时分秒把时间戳的类型转换过来,就会发现日期是选择的哪一天,但是时分秒是当前电脑的时分秒但是根据业务需求需要控制时分秒如(1949-10-1 00:00:00 1949-10-1 23:59:59)

2023-11-26 15:53:34 2428

原创 uni-app 使用uni.getLocation获取经纬度配合腾讯地图api获取当前地址

最近在开发中需要根据经纬度获取当前位置信息,传递给后端,用来回显显示当前位置查阅uni-app文档,发现uni.getLocation () 可以获取到经纬度,但是在小程序环境没有地址信息思考怎么把经纬度换成地址,如果经纬度是key,那地址就是value,第三方地图就是数据库所以我们只要使用uni.getLocation ()获取经纬度配合地图api就可以解决这个需求报错一是因为微信小程序官方最近必须对相应api进行权限申请,询问用户。报错二是询问用户是否愿意获取当前位置信息。

2023-11-22 21:28:45 2139

原创 vue-使用input封装上传文件图片全局组件

实际开发过程中,我们经常遇见需要上传文件图片功能,可以封装一个全局组件来调用原理很简单,首先获取到文件或图片对象,调用自己公司文档服务器的接口,上传文件图片为了方便用户体验,我们应该在上传之前开启遮罩层,上传成功之后关闭遮罩层。我们还可以根据实际开发场景自定义把url和文件名称传回父组件data})

2023-11-22 21:22:18 450

原创 vue 使用js new Map()优化多个if else 执行方法

在实际开发中根据业务需求我们经常要判断情况,一个if 我们科技直接使用ES6就可以解决经常会出现根据不同的条件执行不同的方法,这是就会有多个if else 看起不太美观也费劲js new map ()就可以解决这个问题,它就是一个容器,我们可以通过set,get存取东西map 是以key value 形式存在的,只要我们把value存成方法,并且执行就可以解决问题了注意:map 的key注意类型,比如存的时候用的数字1,取的时候用字符串1,也会导致取不到。

2023-11-12 10:47:54 627

原创 git stash暂存-详细命令使用

在日常开发使用git的时候,一般都是不推荐无意义的提交,但没人监管时候(一言难尽)因为实际开发,可能平凡的几个功能,几个版本一起写,临时打包,导致方便快捷直接提交但身为一名开发人员我们尽量一个功能提交1次,这样方便版本管理和代码回滚准确省事虽然不能100%一次提交一个功能,但我们可以尽量靠近,解决方案git stash暂存。

2023-11-07 21:35:57 305

原创 npm ERR! code ERESOLVE,npm ERR! ERESOLVE unable to resolve dependency tree

当你第一次下包,或者删除node_module之后,突然npm i报错,这是因为npm版本导致的可能是某些包版本跟npm 不兼容导致的(peerDependencies)npm ERR!

2023-11-07 21:33:41 1058 2

原创 uni-app 微信小程序-完善用户隐私保护指引-(chooseAndUploadFile:fail api scope is not declared in the privacyaereemen

最近突然发现uni-app上传组件,在微信开发者工具上传图片时候,打开不了文件资源,报错在体验版和上线版本一样的情况,上传图片的时候打开不了照相机和相册,报的错也是同样其实这是因为小程序后台没有完善用户隐私保护指引,和对应的api和组件的申请权限在查询这个问题过程中,发现很多说组件手动上传,设置,改基础库的等等后面排查问题越来越晕-下面是自己解决这个问题过程分享给大家。

2023-10-27 22:21:56 5874 34

原创 vue el-dialog弹出框自定义指令实现拖拽改变位置-宽度-高度

在实际开发中我们经常使用el-dialog弹出框做表单,一般情况都是居中。遮挡到了一部分数据当我们想要查看弹出框下面的数据时,就只能先把弹出框关闭,查看完数据之后在打开弹框我们通过动态样式,和鼠标事件就可以实现。但自己写的在适配性和全面性上还是有所欠缺的这种我们可以直接复制使用,写成全局自定义指令。多的地方使用,并且只做加法1.来到src/创建directive文件夹2.在src/directive/创建dialog文件夹专门用来放关于dialog的代码。

2023-10-20 20:24:53 3094 2

原创 路虽远行则将至,事虽难做则必成-風过无痕

路虽远行则将至,事虽难做则必成-風过无痕

2023-10-19 22:07:01 300 2

原创 uni-app checkout(多选)radio(单选)选中之后样式不会出现钩子

最近在实际开发过程中发现项目的多选和单选选中之后都是只有颜色,没有钩子,或者是另外图案刚开始并不重视,猜测可能是微信基础库的bug,可能换个基础库就行了,或者是编辑器显示问题最后在查阅之后才发现,这个问题是可以解决的。是因为项目全局样式和隐藏影响到了。

2023-10-19 21:15:55 592

原创 vue el-dialog封装成子组件(组件化)

实际开发过程中我们经常听见组件化开发,但在实际开发过程中(没有人审查时)怎么方便来我们有时是因为时间不够,所以把所有代码写在一个页面。当业务逻辑复杂时可能会有1k多行虽然不能要求自己写出高效复用性高的组件,把dialog弹出框写成一个子组件抽走还是可以的当你把表单抽在就会发现代码少了很多。

2023-10-18 20:48:34 2769

原创 vue 后端返回二进制流-前端通过blob对象下载文件-图片

在实际开发中我们经常会遇见下载文件的场景,比如下载合同,下载文件下载文件有2种方式,一种是后端返回二进制流,前端通过blob对象接受根据不同类型下载还有一种把地址直接在浏览器新窗口打开浏览器打开pdf可以预览和下载,其他文件直接下载但不管是那种方式,原理都是一样的只是取决于谁来执行转化代码。

2023-10-18 20:46:30 2717 2

原创 Nginx配置ssl证书,加密成https过程细节(the ssl directive is deprecated-cannot load certificate)

日常开发中我们在公网访问项目时,一般都是安全连接,https://开头(极少数http://)当我们自己配置的域名服务器,通过Nginx转发之后确实http,这是因为我们没有配置证书浏览器会察觉我们的传输没有规范加密,所以认定我们的连接不安全,但并不影响使用其实当域名是我们自己时候,是有相对应免费的ssl证书申请,只是我们自己没有申请。

2023-09-17 09:12:28 614

原创 un-app-手机号授权登录-授权框弹不出情况

手机号授权是获取用户信息api停用之后,经常使用的api。但是此api也是有很多坑手机号授权会出现调用不起来的情况,这是因为小程序后台没有进行微信认证导致的。

2023-09-09 21:21:36 934 3

原创 element-tree树结构-默认选中第一个节点高亮-根据id选中节点高亮

tree树结构是在开发中经常使用的组件,比如区域树,楼层树,组织架构树,等等包含节点关系实际开发可能需要我们一进到页面选中树形结构第一个节点,并且调用数据,来达到用户体验在用户选择之后,通过本地存储的方式把楼层id存起来,刷新之后获取楼层id,调用数据或者为了用体验我们需要在选中同时高亮,在状态保持之后,把绑定楼层id节点高亮提示用户万变不离其宗,基于文档介绍和HTML结构代码。我们可以通过2种办法实现。

2023-09-09 21:17:29 6395

原创 uni-app运行到微信开发者工具-没有打印的情况

到我们进场使用微信开发者工具时,就会发现它经常会有bug,特别是在软件更新,组件库更新之后最近在更新微信开发者工具之后发现所有打印都不显示了,虽然是小问题-但对于强迫症很烦以为是代码配置问题-结果是更新之后打印开关开启不打印。

2023-09-09 21:13:47 866

原创 uni-app 使用uCharts-进行图表展示(折线图带单位)

在uni-app经常是需要进行数据展示,针对这个情况也是有人开发好了第三方包,来兼容不同平台展示uCharts和pc端的Echarts使用差不多,甚至会感觉在uni-app使用uCharts更轻便,更舒服但是这个第三方包有优点就会有缺点,还会有坑的地方下面我会一一讲解。

2023-09-08 22:06:07 3254

原创 uni-app开发的微信小程序-打回登录页时会在左上角出现一个房子图标(返回首页)- 怎么回事-怎么解决

发现项目,在首次进入时打回登录页,原生导航栏左边会出现一个房子按钮可以直接返回首页最后查了一圈发现这个微信版本更新之后,当我们进入不是首页,或者tabbar页面时就会出现微信针对这个也是有解决方案的,可以在微信环境时把他禁用(在h5环境是不会出现的,只有微信有)还有一种办法,只有在原生导航栏时才会出现,我们如果禁用原生导航栏就从根本解决问题。

2023-09-08 22:05:19 2673 3

原创 uni-app 自定义导航栏-解决适配问题

在实际开发中我们是根据需求,原型图,功能配色来开发,并不是考虑这个组件是不是能实现首页我们不需要跳转时,会出现标题左移,渐变色,输入框,等等布局,原生导航栏就不满足需求这时我们需要自定义导航栏,uni-app 确实提供了css变量,告诉我们手机系统栏高度,胶囊按钮高度,但我们写死时会因为不同的机型,导致页面的布局破坏,这是因为不同手机分辨率,缩放有差异,会导致系统栏,胶囊按钮差异,这是如果我们高度全局写死就会乱。换个角度思考,那为什么微信自己封装的代码,就可以适配这些问题-是因为它把高度写活了。

2023-09-08 22:02:53 839

原创 vue优化首屏加载时间优化-cdn引入第三方包

为什么要进行首屏加载优化,因为随着我们静态资源和第三方包和代码增加,压缩之后包会越来越大随着网络的影响,在我们第一输入url请求资源时候,网络阻塞,加载时间长,用户体验不好仔细观察后就会发现,代码压缩之后并没有多大,大的都是项目自身,静态资源,第三方包除去代码层面我们可以通过静态图片网络请求,gzip压缩,CDN(第三方包引入方式),浏览器缓存当我们在本地开发,需要使用到别人的包的时候。通过npm下包。

2023-09-05 20:59:06 1438 2

原创 vue优化首屏加载时间优化-gzip压缩

为什么要进行首屏加载优化,因为随着我们静态资源和第三方包和代码增加,压缩之后包会越来越大随着网络的影响,在我们第一输入url请求资源时候,网络阻塞,加载时间长,用户体验不好仔细观察后就会发现,代码压缩之后并没有多大,大的都是项目自身,静态资源,第三方包除去代码层面我们可以通过静态图片网络请求,gzip压缩,CDN(第三方包引入方式),浏览器缓存。

2023-09-04 22:44:57 358

原创 vue-canvas基本使用和注意事项-动画闪烁效果-自适应适配不同分辨率问题

canvas画布是html的新特性,熟悉画布我们可以完成很多拖拽,标注,动画的功能使用canvas实现一个小例子很容易,但是真正在项目中使用时,我们需要注意的地方有很多canvas基本原理就是它基于渲染方法,根据画布相对的x,y坐标,长,宽,来渲染画布效果熟练使用之间我们肯定是需要连接基本使用和相关注意事项,才能在遇到问题时快速解决。

2023-08-24 21:39:49 1324

原创 vue-pc端禁止用户选中文字-右键-复制

pc端开发中我们经常会遇见一些页面,会因为刷新,渲染,卡顿出现文字选中效果或者一些敏感的页面我们不希望用户复制,选中,页面的文字信息,比如考试,敏感信息其实这些也是可以通过代码控制的,这样可以使项目更加安全,合理。把代码写在页面mounted就是这个页面不可以复制,选中,右键,写在app.vue页面的mounted就是整个项目不可以选中,复制,选择。

2023-08-24 21:33:18 653

原创 vue-pc上传优化-uni-app上传优化

经过这一趟流程下来相信你也对 vue-pc上传优化-uni-app上传优化 有了初步的深刻印象,但在实际开发中我 们遇到的情况肯定是不一样的,所以我们要理解它的原理,万变不离其宗。加油,打工人!

2023-08-22 21:53:35 461

原创 vue-pc端elementui-统一修改问题-Dialog 对话框点击空白关闭问题-element-所有组件层级问题

经过这一趟流程下来相信你也对 vue-pc端elementui-统一修改问题 有了初步的深刻印象,但在实际开发中我 们遇到的情况肯定是不一样的,所以我们要理解它的原理,万变不离其宗。加油,打工人!

2023-08-10 23:02:54 1648

原创 vue-pc端Message 消息提示防抖处理-短时间内只触发一次

element提供的的message消息提示用确实方便直接代码就搞定。但是在特定的场景并不适用点击某一个点位提示用户点击了或者websocket推送提示用户来信息了(这种提示用户场景)如果有很多推送信息来,或者用户一直点击。这是屏幕会一直弹出message提示信息往下堆叠并不友好,而且还会把屏幕挡住。使得用户体验很不好,我们应该对弹出框信息进行防抖处理并且这种处理我们最好做加法,这样原来在页面中写的message提示消息也不用二次修改。

2023-08-10 23:01:21 549

原创 vue-pc端实现按钮防抖处理-自定义指令

我们经常在移动端会处理按钮和输入框的防抖和节流处理,在pc端很少进行这样的操作但是在pc端也是可以进行按钮的防抖操作,这样也是比较合理,可以不用但不可以不会我们只要配合vue项目自定义指令加上全局注册,就可以实现按钮的防抖操作。并且这种方式是在做加法,把自定义指令全局注册之后,只需要把@click换成v-antishake(自定义指令)即可转存失败重新上传取消1.在src/directive/module下建立antishake.js文件-代码如下}, 2000)})​。

2023-08-10 22:59:37 496

原创 uni-app-使用tkiTree组件实现树形结构选择(​自定义组件 components/tki-tree/tki-tree 建议移动到子包 subpkg 内)

在实际开发中我们经常遇见树结构-比如楼层区域-组织架构-部门岗位-系统类型等情况往往需要把这个树结构当成条件来查询数据,在PC端可以使用Tree,table,Treeselect等组件展示在uni-app的内置组件中似乎没有提供这样组件来展示,但是是有第三方包tkiTree组件来解决这个问题我是基本使用,通过确认之后传递id和name形式来使用,据说深层次使用会有很多bug(需要自己尝试)

2023-08-04 21:32:45 2656

原创 vue- form动态表单验证规则-表单验证

以element官网的form表单的-动态增减表单项为例讲解表单验证规则动态的功能就是v-model配合push + v-for 便利来实现的我们需要熟知2个知识点prop表单验证需要跟v-model绑定的值是一样的,如果是一个数组便利的表单,那就需要绑定这个数组每一项v-model值。

2023-08-04 21:30:57 1513

原创 vue-使用canvas画布实现平面图点位标注功能

最近需要一个在平面图标注点位功能,去搜了一圈,发现......,最后在查阅文档一顿操作之后。不停修改bug之后,做出一版可以基本使用的版本。最后发现canvas标签可以完成很多功能,电子签名,点位标注,问题标注,画图功能等等。

2023-07-26 22:11:38 1479 2

原创 Websocket协议-http协议-tcp协议区别和相同点

1.websocket协议WebSocket 是一种网络通信协议。RFC6455定义了它的通信标准。WebSocket是HTML5下一种新的协议(websocket协议本质上是一个基于tcp的协议)WebSocket在建立握手时,数据是通过HTTP传输的。但是建立之后,在真正传输时候是不需要HTTP协议的websocket约定了一个通信的规范,通过一个握手的机制,客户端和服务器之间能建立一个类似tcp的连接,从而方便它们之间的通信。

2023-07-26 19:02:03 1093

空空如也

空空如也

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

TA关注的人

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