- 博客(33)
- 收藏
- 关注
RSS订阅原创 gsap动画库对threejs模型的应用
threejs 场景以及立方体创建，以及gsap对three模型位置移动、沿轴旋转、缩放、透明度、颜色过渡的简单实现
2024-06-27 09:48:17
336
原创 【npm下载包报错：CERT_HAS_EXPIRED，问题解决】
之前的镜像域名在2024年1月22日https证书到期了。根据第三行报错的提示得知报错原因是证书已过期。上网一查，原来常用的淘宝镜像早就换新域名了，我平时使用nrm管理npm的源地址。就成功了，可以继续正常的操作了。npm安装依赖的时候出现报错。替换为最新的地址就可以了。需要更新一下淘宝镜像地址。
2024-02-26 15:35:17
729
原创 js map循环中await无效问题解决
接口获取页面表单列表。遍历找出需请求下拉数据的select，获取下拉数据并赋值给表单项，重新渲染页面实现表单展示。页面渲染发现，表单项成功展示，但是下拉未显示。但是代码中的打印处显示数据还是正确的。猜测是map中的await失效，在console处debugger发现确实如此。......
2022-06-20 15:27:21
1592
原创 React函数组件实现获取子组件标签（forwardRef的使用）
需求说明父组件触发事件改变子组件的状态举例例子： 切换父组件tab时，重置子组件表单。在第一个tab下的搜索表单填写的搜索条件，在切换tab时，需清空表单内容代码结构const parent = () => { return ( <> <Tabs onChange={changeTabs}> {tabsList?.map((tabItem: tabItem) => <TabPane tab={tabI
2022-05-31 15:38:38
1735
原创 Vue实现视频播放（video.js）
项目中需要实现播放m3u8类型的视频。h5的video标签不支持该类型的视频，所以使用了videojs下载依赖npm i --save video.js引入// main.js中引入样式import 'video.js/dist/video-js.min.css'// 视频播放页面import videojs from 'video.js';初步实现<template> <div class="videoArea"> <video r
2022-03-17 15:52:41
11012
2
原创 vue使用swiper失效问题解决
问题描述需求是 要在一个循环的列表中第一组数据后添加一个轮播，效果如下由于所有循环的数据都是一个接口返回，并在一个数组中。由以下代码实现<div v-for="(item, index) in videoList" :key="index"> <div class="index_list01"> <div class="index_list"> <div class="index_list1">
2022-03-16 15:16:10
2316
原创 前端实现 文件上传/下载 进度显示
介绍项目开发中，在文件上传或者下载的过程中，经常因为文件过大导致访问接口的时间过长。所有需要添加一个反馈来显示当前文件上传/下载的进度。以下内容以文件下载为例axios快速通道：axios官方文档查阅官网发现有以下两个配置项代码实现// onDownloadProgress 接收一个函数// progressEvent.loaded 已下载的文件大小// progressEvent.total 全部文件大小axios({ url: '/download/excel-api/ex
2021-12-28 16:45:59
4316
原创 ant Design的Form组件实现通过实例设置嵌套表单项的值
情况描述官方的下图例子中，点击Fill form可以填充表单内容代码如下：表单内容<Form.Item name="note" label="Note" rules={[{ required: true }]}> <Input /></Form.Item><Form.Item name="gender" label="Gender" rules={[{ required: true }]}> <Select placehol
2021-12-27 13:58:10
1890
原创 Dva脚手架设置端口号未生效问题解决
公司的老项目改写，发现项目启动后是8000端口（众所周知，dva默认启动端口号为8000）但是项目中使用的全部都是8005端口，查看package.json发现，之前的开发人员手动设置了端口为8005但是启动项目的时候没生效。同事反映发现，window的端口生效，mac不行查找文档发现，是mac的配置语法与window不同，导致的mac未生效除此之外，还发现了兼容不同系统的指令cross-env PORT=3000 roadhog server注意若使用默认的端口8000，当端口被占用
2021-12-23 18:08:53
832
原创 前端ajax跨域处理
前情后端给的接口在浏览器中可以拿到返回值，由于浏览器的同源策略，在项目中使用ajax报跨域。同源策略这里不多说，具体说一下怎么解决。用nodeJs做代理1. 初始化项目创建一个空文件夹，在文件夹下npm init所有选项默认即可2. 启动一个express项目安装expressnpm i express -s在根目录下创建index.js文件// index.jsconst express = require('express')const app = express()c
2021-12-21 20:49:56
743
原创 node版本管理器n的使用
灵活下载并切换不同版本的node注意若n的指令报出以下错误，在指令前添加sudo，填写本机密码即可正常使用使用全局安装 nnpm install n -g 如果出现上图提示代表下载成功安装node安装最新版本node// 下载最新n latest // 下载稳定版最新n lts安装指定版本node// 若该版本已下载，则直接切换// 若该版本未下载，则下载并切换n <version>n install <version>查看已下载node
2021-12-21 15:18:30
6666
原创 npm上传包的流程
注册/登陆 npm帐号快速跳转：npm官网地址查看/切换npm地址// 切换npm config set registry https://registry.npmjs.org切换后没有任何效果，需查看当前npm地址// 查看npm config get registry当前npm显示为图中地址，表示切换成功。如果你的地址本身就是这个，忽略这步骤本地登陆// 登陆npm login登陆时会出现图片上的内容，此时要注意登陆的npm地址。如果你的npm地址和我的一样，是
2021-10-26 13:39:20
641
原创 大文件分片上传功能实现
前言本文章只是对开发过程的记录，点击查看完成代码该使用组件说明： 点击查看组件使用说明内部使用组件信息： Plupload中文文档起因公司业务需要上传较大文件，但是接口不支持超过50M的文件上传。于是需要前端在上传时进行切片处理。前端采用的技术是react + antDesign，查找了antd的官法文档，发现Upload组件没有文件分片的功能。在npm上根据react 和upload为关键字进行查找，找到了react-plUpload包。下载安装后，发现无论是样式效果还是功能实
2021-10-22 17:02:10
685
2
原创 plupload-antd-react大文件分片上传组件使用
这里写自定义目录标题欢迎使用Markdown编辑器新的改变功能快捷键合理的创建标题，有助于目录的生成如何改变文本的样式插入链接与图片如何插入一段漂亮的代码片生成一个适合你的列表创建一个表格设定内容居中、居左、居右SmartyPants创建一个自定义列表如何创建一个注脚注释也是必不可少的KaTeX数学公式新的甘特图功能，丰富你的文章UML 图表FLowchart流程图导出与导入导出导入欢迎使用Markdown编辑器你好！ 这是你第一次使用 Markdown编辑器 所展示的欢迎页。如果你想学习如何使用Mar
2021-10-22 09:44:20
1417
4
原创 css实现div宽高等比例
移动端经常实现图片width为100%，height始终与width等比例展示使用padding属性可以很好的解决这个问题在文档中可以看出，padding的值为百分比时，是基于父元素宽度来设置的<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><style.
2021-08-27 16:30:28
2003
原创 uni-app 实现验证码框自动聚焦
做手机验证码登录 想实现输入后自动聚焦到下一个文本框其实非常简单 但是实现过程中找了好多 在ref实例上或者dom上绑定focus 都没生效记录下
2021-06-07 14:13:01
1830
1
原创 vue-amap如何设置文本覆盖物（text）的背景颜色/图片
vue-amap如何设置文本覆盖物（text）的背景颜色/图片一、css设置在浏览器中查看标签，可发现text组件有一个‘amap-overlay-text-container’的class只需要用deep修改该class样式 即可@{deep}.amap-overlay-text-container{background: url(../../../assets/img/icons1.png)二、event设置<1>整体设置，全体text显示一种背景图组件绑定
2021-03-12 16:07:38
2255
2
原创 webstorm使用git以及github
git的下载安装就不再赘述，基本都是无脑下载安装对git安装配置感兴趣的，可以看另一篇文章https://blog.csdn.net/Li_na_na01/article/details/105261901一、本地git的安装和使用1.配置git的安装目录在settings中找到版本控制器下的git，在path的位置设置自己git的安装路径2.创建本地git库VCS下找...
2020-04-03 15:11:45
828
原创 tinymce富文本编辑器实现本地图片上传
在开发过程中使用tinymce富文本编辑器，发现他的图片上传默认是上传网络图片那么如何实现上传本地图片呢，上官网逛一圈，发现其实很简单在官网中找到下面这张图片，并且有相关的例子这里，我使用了自定义函数images_upload_handler (blobInfo, success, failure) { const url = 'uploadImg' ...
2020-04-03 11:51:25
6094
6
原创 git初级使用
什么是gitgit是一个免费并且开源的分布式版本控制系统。那什么是版本控制系统呢？--保留文件所有的修改历史记录，可以方便地撤销之前对文件的修改操作官网：https://git-scm.com/简单命令git init 初始化创建仓库 （会创建出一个隐藏的.git文件夹，所有的操作历史将存入这里）git status ...
2020-04-02 11:44:27
149
原创 git安装步骤讲解
安装Git的时候，总是在下载完就一路默认安装，可能就切换一下安装的位置，那么其他默认的选项到底是什么呢?这里记录一下，以便以后有问题的时候可以查看 ...
2020-04-02 09:22:06
229
原创 element-ui图片上传不为空的表单验证
在做表单提交时，使用了element-ui的upload组件进行图片上传。没有内容时，进行提交，出现下图目前一切正常，但是当我将内容都填上时，其他的验证信息都消失了，图片的仍然在，如图虽然不影响提交，但是不太好看，需要处理。于是上官网找了一圈，发现upload组件没有事件，比如input组件的blur，change，focus之类的这就不能在rule中的通过trigge...
2020-03-26 16:47:43
4386
5
转载 git在webstorm中回滚单个文件
第一步 单个文件 右键单击第二步 双击 要回滚的那次 左右对比代码 左侧为当时提交之前的代码 复制 粘贴回来就可以了3 这里不建议 直接 在git记录上 revent commit 因为 你要对单个文件操作 但是这次commit ...
2019-11-28 10:24:16
1730
2
原创 vue获取qq音乐歌曲音频资源
最近在看一个仿QQ音乐的移动端音乐App，发现获取不到音乐的音频资源，于是打开QQ音乐官网，发现音频的播放地址改变了在下图audio标签中可查看，地址为http://ws.stream.qqmusic.qq.com/C400003gfggs1r3Bcc.m4a?guid=1329984726&vkey=E8A7BFD68425341AFAF0FC1BB21D4FB5AF06C917...
2019-10-14 17:35:01
2312
10
原创 elementui中select框选值后赋值成功但框上不显示的问题解决
当时的需求是这样的，点击表格后面的编辑，将当前行内容带到弹框中，并执行修改。没带表格内容时，select框表现正常，传入当前行值后，出现了不显示值的问题，但是我再@change中还是可以获取到新选择的值上网找了一下，发现vue官网中说明：发现由于我的value属性是动态添加的，导致vue无法检测。于是，调整了下代码for (let i = 0; i < this.c...
2019-07-30 14:38:20
5927
4
原创 js实现手机摇一摇以及震动功能
事件监听DeviceMotion，html5提供的新的DOM事件，其提供设备的加速信息，表示为定义在设备上的坐标系中的卡尔迪坐标。其还提供了设备在坐标系中的自转速率。DeviceMotionEvent 会在设备发生有意义的摆动(或运动)时产生.事件对象封装有产生的间距值,旋转率,和设备加速度.加速度的计算方式是重力和用户产生的两个加速度矢量之和.设备是通过 陀螺仪和加速计来区别这两者的....
2019-02-20 18:00:46
2439
3
原创 jquery动态创建的元素如何触发click事件
今天写项目时偶然发现，我用的jquery的追加（）动态创建的元素点击之后没有反应，查阅资料后才知道需将单击事件绑定在其父级标签上。例如：HTML：<按钮>还想吃</按钮><div class =“swrap”> <div class =“lotteryTags”>海鲜火锅</ div> <div class =“lotte...
2018-04-27 16:42:18
1319
1
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人