- 博客(28)
- 收藏
- 关注
RSS订阅原创 前端性能优化
简单来说就是你的网站够不够快打开速度动画效果表单提交列表滚动页面切换。。。MDN上的web性能定义：Web性能是网站或应用程序的客观度量和可感知的用户体验减少整体加载时间： 减少文件体积、减少HTTP请求、使用预加载使网站尽快可用：仅加载首屏内容，其它内容根据需要进行懒加载平滑和交互性：使用css替代js动画、减少UI重绘感知表现：你的页面可能不能做得更快，但你可以让用户感觉更快。耗时操作要给用户反馈，比如加载动画、进度条、骨架屏、等提示信息。
2024-07-26 15:24:46
962
原创 React路由笔记
Switch></Switch>exact 精确匹配 (Redirect 即使使用了exact, 外面还要嵌套Switch 来用)stack,这个警告只有在hash 模式会出现。react-router ：核心模块，包含 React 路由大部分的核心功能，包括路由匹配算法和大部分核心组件和钩子。
2023-12-11 15:04:58
853
原创 react笔记
当我们想在两个函数之间共享逻辑时，我们会把它提取到第三个函数中。必须以"use"开头吗？必须如此，这个约定非常重要，不遵循的话，由于无法判断某个函数是否包含对某内部Hook的调用，React将无法自动检查你的Hook是否违反了HooK的规则。
2023-12-11 13:44:50
1083
原创 Typescript笔记
JS 已有类型原始类型，简单类型（ number/string/boolean/null/undefined ）复杂数据类型（数组，对象，函数等）TS 新增类型联合类型自定义类型（类型别名）接口元组字面量类型枚举void泛型是可以在保证类型安全前提下，让函数等与多种类型一起工作，从而实现复用，常用于：函数、接口、class 中创建一个 id 函数，传入什么数据就返回该数据本身(也就是说，参数和返回值类型相同)
2023-11-19 01:07:05
83
原创 el-tree回显 包含父节点子节点全部选中问题
在做权限的时候，提交数据会把选中与半选中的数据提交给后台，但是在回显时后台返回的数据包含父节点，导致子节点全部选中。解决方法，在回显的时候把后台返回的数据中把所有的父节点给删掉这样就能问题。a. tree 数据结构。b. 回显数据包含父节点。
2023-09-12 10:09:14
835
原创 Mysql概述--基础篇
执行如下脚本，创建emp表与dept表并插入测试数据-- 创建dept表，并插入数据 create table dept(id int auto_increment comment 'ID' primary key , name varchar(50) not null comment '部门名称') comment '部门表';
2023-07-21 13:16:31
313
原创 mysql安装与卸载
要想使用mysql，我们首先先得将Mysql安装好，我们可以根据下面的步骤，一步一步的完成Mysql的安装。如果已将MySQL卸载，但是通过任务管理器—>服务，查看到MySQL服务仍然残留在系统服务里。4). 选择 “新建” , 将MySQL Server的安装目录下的bin目录添加到环境变量。安装好MySQL之后，还需要配置环境变量，这样才可以在任何目录下连接MySQL。安装MySQL的相关组件，这个过程可能需要耗时几分钟，耐心等待。2). 点击左侧的 “高级系统设置”，选择环境变量。
2023-07-17 09:10:08
58
原创 Git概述
本地仓库：开发人员自己电脑上面的git仓库远程仓库：远程服务器上的git仓库commit: 提交，将本地文件和版本信息保存到本地仓库push: 推送，将本地仓库文件和版本信息上传到远程仓库。
2023-05-20 15:06:59
67
原创 vue + scss实现管理系统换肤功能
因公司需求，需要实现管理系统主题换肤功能，主要是实现4种不同的系统肤色，极简白、幻境紫、景泰蓝、复古黑，这不仅仅是颜色的更改，还需要包括图片，字体、按钮等更改。1.theme.scss文件主要实现的是编写对系统主题改变的样式函数，通过传递样式参数来实现不同主题的样式更改。在styles样式文件夹下创建两个scss文件，一个theme.scss,一个color.scss。2.color.scss编写不同主题的样式函数并传递样式参数。
2023-03-27 09:55:14
638
原创 小程序切换前后台获取实时地理信息进行定位上报
在做小程序有个需求要采集司机定位并进行上报给后台，之前用了wx.getLocation() 和定时调用setinterval在一定的间隔内进行采集和上报司机位置，但是频繁调用时它给我返回报错信息 官网解释 高频率调用会导致耗电 ，而且2.17.0 增加调用频率限制，后面使用了wx.startLocationUpdateBackground 和 wx.onLocationChange 不管是切换前后后都能获取地理位置信息。
2022-11-05 00:10:17
2842
原创 高德地图使用vue-amap开发 页面刷新地图空白
使用vue-amap地图开发的时候，刷新页面地图就不显示了。因为刷新的时候AMapUI没有加载出来导致地图显示空白。使用remoteLoad 来解决// remoteLoad.jsexport default function remoteLoad(url, hasCallback) { return createScript(url) /** * 创建script * @param url * @returns {Promise} */ function cr
2021-10-19 10:28:07
6177
5
原创 Vue生命周期函数
生命周期函数介绍：生命周期函数是指组件从创建到销毁的过程自动执行的函数(生命周期函数是组件所经历的过程，跟代码顺序无关)。它大概可以分为3个阶段：挂载 => 更新 => 销毁。挂载分为：beforeCreate、created、beforeMount、mounted; 更新分为：beforeUpadte、updated; 销毁可以分为：beforeDestroy、destroyed；图示：钩子函数详解beforeCreate此钩子函数发生数据监测和数据代理之前，实例初始化之后被调用。
2021-09-29 16:18:13
161
原创 高德地图自定义车辆定位marker以及弹出框窗口
地图安装npm install vue-amap --save项目中设置高德地图安装成功后在main.js设置以下内容import VueAMap from 'vue-amap'Vue.use(VueAMap)VueAMap.initAMapApiLoader({ key: '你的key', plugin: ['AMap.MouseTool', 'AMap.PolyEditor', 'AMap.ToolBar', 'AMap.MapType', 'AMap.PlaceSearch', '
2021-09-29 10:24:38
1358
原创 vue + threejs 实现3d装车
安装npm install threejs -D引用threejsimport * as THREE from 'three'// 鼠标控制器import { OrbitControls } from 'three/examples/jsm/controls/OrbitControls.js'// obj模型import { OBJLoader } from 'three/examples/jsm/loaders/OBJLoader'// 材质import { MTLLoader } f
2021-07-23 11:01:33
3003
3
原创 vue文件上传组件，使用原生input file实现
vue 实现输入框右侧icon文件夹点击上传图片组件a. 调用图片上传父组件formData 就获取 图片上传组件传过来的地址。// html<upload-image v-model="formData" />b. 图片上传组件// html <template> <div> <el-input clearable v-model.trim="uploadImgUrl" size="mini"
2021-07-04 02:51:17
1045
原创 js mouseup丢失问题(不执行)与解决办法
当实现鼠标在可视区域上面进行拖动的时候，经常出现 mouseup 事件丢失的情况，导致正常的流程没法执行。元素执行mousedown 在可视化区域上面拖动一段时候鼠标松开 有些时候mouseup不会执行。解决方法：mounted() { this.init()},methods: { init() { document.body.addeventlistener('mouseup', () => { // mouseup 需要执行的代码块 ....
2021-07-04 02:09:02
3765
2
原创 移动端拖动元素导致页面返回上一层
解决方法一：html{ touch-action:none; touch-action:pan-y;}解决方法二： var startX,startY;document.addEventListener("touchstart",function(e){ startX = e.targetTouches[0].pageX; startY = e.targetTouches[0].pageY;});document.addEventListener("touchm
2021-01-07 14:59:22
4152
1
原创 vue element DateTimePicker日期时间选择器二次封装
在管理系统项目开发中，使用elementUi库日期时间选择器是最常见的也是最常用，需要使用的话一个一个写的很麻烦而且不方便使用，封装成组件的话方便于管理只要用就调用这个组件就可以使用。子组件：type显示类型 可以分别为 year/month/date/week/datetime/datetimerange/daterangevalueFormat 绑定值的格式,一般是参数传到后台的数据格式pickerOptions: 快捷键以及配置项defaultTime：选中日期后的默认具体时刻 数据格式为
2020-12-11 22:58:23
2749
原创 js数组操作
两个字段一个是用户的id 一个是用户的名称，需要把这两个字符转成数组再转成对象数组var str1 = '小明,小兰,小钱'var str2 = '12,13,15'var str1Arr = str1.split(',')var str2Arr = str2.split(',')var result = str1Arr.map((val,i) => ({id: val, val: str2Arr[i]}));2.两个数组arr1 = [ {id: “#11”, val: “徐.
2020-12-07 09:53:37
462
原创 vue element el-date-picker日期选择器选择时间区间
1.在项目中使用到了element日期选择组件，选择日期区间最大为6个月之前是让不在这区间给限制不让选择html部分 <el-date-picker v-model="params.dateTimeRangeVal" type="datetimerange" :editable="false" value-format="yyyy-
2020-12-04 10:57:59
6254
原创 vue+ckeditor5图片视频上传
1.安装ckeditor5提供三种方法安装npm、CDN和下载ZIP文件到项目中，这里就使用了npm安装具体看官网文档ckeditor5官网。安装命令npm install @ckeditor/ckeditor5-build-decoupled-document --save卸载命令npm uninstall @ckeditor/ckeditor5-build-decoupled-document --save2.引用在相对应的组件引入import CKEditor from '@cke
2020-12-02 11:11:01
3795
10
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人