- 博客(49)
- 收藏
- 关注
RSS订阅原创 cookie、localStorage和sessionStorage三者区别
获取指定名称的cookie值function getCookie(name) { //获取指定名称的cookie值// (^| )name=([^;]*)(;|$),match[0]为与整个正则表达式匹配的字符串，match[i]为正则表达式捕获数组相匹配的数组；ocalStorage和sessionStoragelocalStorage和sessionStorage所使用的方法是一样的使用方式基本就是上面这些cookie：可设置失效时间，没有设置的话，默认是关闭浏览器后失效localStora
2022-07-11 09:09:25
412
1
原创 uniapp微信小程序发布h5适配
背景这次项目是要兼容微信小程序、h5的。目前开发完成发现，微信小程序和手机浏览器打开h5，页面都是正常的。在PC浏览器和ipad上打开H5，出现了布局和字体错乱。解决步骤自定义模板路径在manifest.json H5配置中，填写 index.html 模板路径这是为了方便些条件编译当在h5下的时候在index.template.html中<!DOCTYPE html><html lang="zh"><head> <link rel="shor
2021-12-26 09:08:29
2438
3
原创 uniapp跳转前验证用户是否登陆并保存用户授权信息
背景这次项目有一个需求是实现点击一些按钮路由跳转前验证用户是否登陆，以及一些不跳转路由的功能，按钮点击后出现模态框前验证用户是否登陆。方案选择路由守卫首先我并没有选择路由守卫，因为我的需求有不进行路由跳转进行验证的地方。但是路由守卫用来做跳转前验证肯定是个不错的选择。我贴一个博客大家可以参考其他人的路由守卫方案https://cnblogs.com/XHappyness/p/13808413.html自定义验证方法我是自己写的贴合需求的验证授权方法。1.考虑跳转路由可以使用2.在某些不
2021-12-18 21:42:23
2204
原创 扫普通二维码跳转微信小程序
背景这次项目有一个需求是实现扫描二维码跳转到微信小程序登陆授权页，这个官方文档写的是比较清晰的。当然第一次配可能会有一些问题步骤1.二维码跳转规则官方这样写：如原有二维码链接为 http://www.qq.com/a/123456 ，其中12345为业务参数，则可配置规则 http://www.qq.com/a/ 实现扫码打开小程序。官方还给出了一些常见的错误类型：2.二维码内容获取官方说：二维码链接内容会以参数 q 的形式带给页面，在onLoad事件中提取 q 参数并自行 de
2021-12-12 10:25:02
3024
原创 uniapp自定义多列选择器省市两级联动
背景这次项目有一个需求是实现省市的选择联动，可是uniapp官方提供的组件默认是省市区三级的。所以我打算自己模仿uniapp提供的多列选择器写一个符合项目需求的选择器解决过程首先这肯定是一个多列选择器range在这里可以看到，多列选择器中的数据是放在 range 中的，它是一个二维数组，长度表示列数，每一项表示每一列的数据。所以我要把省市处理成下面这样的：const a = [['河南省', '山东省'], ['许昌市','郑州市','洛阳市']]valuevalue每一项的值，表示
2021-12-05 11:10:20
5619
3
原创 历时八个月的uniapp微信小程序上传手机内部文件
背景2021.4 党建助手党建助手项目涉及调取手机内部文件进行上传经自己努力——未果经一位老学长和一位学长帮助—— 未果最后 无奈舍弃（因为我大三课程又多又难+菜），解决方案是只适配H5，因为当时这个项目是用来做公众号的，未来可能会转小程序。2021.7 小云通信小云通信在党建助手基础上升级。自然而然就又涉及到了调取手机内部文件上传，同学A做这个模块，他调研了三天，跟我交流后决定找项目负责人学长B沟通换方案。最后，又是设计从手机内部选择文件，改用微信提供的chooseMessageFile，
2021-11-28 11:47:45
3064
11
原创 rem+vw移动端适配
移动端适配rem适配rem是相对于根元素的字体大小的单位，也就是html的font-size大小，浏览器默认的字体大小是16px，所以默认的1rem=16px，我们可以根据设备宽度动态设置根元素的font-size，使得以rem为单位的元素在不同终端上以相对一致的视觉效果呈现。事实上 rem是把屏幕等分成 指定的份数，以20份为例，每份为 1rem ， 1rem 对应的大小就是 rem基准值 ，rem做的就是把 rem基准值 给的 font-size ，所以如果设备的 物理像素 宽为 640px ，分
2021-11-21 18:00:00
331
原创 实现先冒泡后捕获
事件委托简介：事件委托指的是，不在事件的发生地（直接dom）上设置监听函数，而是在其父元素上设置监听函数，通过事件冒泡，父元素可以监听到子元素上事件的触发，通过判断事件发生元素DOM的类型，来做出不同的响应。利用事件冒泡，只指定一个事件处理程序，就可以管理某一类型的所有事件。举例：最经典的就是ul和li标签的事件监听，比如我们在添加事件时候，采用事件委托机制，不会在li标签上直接添加，而是在ul父元素上添加。好处：比较合适动态元素的绑定，新添加的子元素也会有监听函数，也可以有事件触发机制。事件先冒
2021-11-14 16:18:38
1668
1
原创 渲染树和DOM树
HTML 经过解析生成 DOM树； CSS经过解析生成 Style Rules。 二者一结合生成了Render Tree。 通过layout计算出DOM要显示的宽高、位置、颜色。 最后渲染在界面上，用户就看到了浏览器的渲染过程：解析 HTML 构建 DOM(DOM 树)，并行请求 css/image/jsCSS 文件下载完成，开始构建 CSSOM(CSS 树)CSSOM 构建结束后，和 DOM 一起生成 Render Tree(渲染树)布局(Layout)：计算出每个节点在屏幕中.
2021-11-07 15:53:41
654
原创 备考软考易混淆点
UML静态图对象图展现了某一时刻一组对象以及他们之间的关系。对象图描述了在类图中所建立的事物的实例的静态快照，给出系统的静态设计视图或静态进程视图类图展现了一组对象、接口、协作和他们之间的关系用例图展现了一组用例、参与者以及它们之间的关系。主要支持系统的行为，即该系统在它的周边环境的语境中所提供的外部可见服务用于对于一个系统的需求进行建模，包括说明这个系统应该做什么（从系统外部的一个视点出发），而不考虑系统应该怎么做动态交互图用于对系统的动态
2021-10-31 15:01:47
145
原创 进程管理PV操作 截图 思路
进程管理进程的状态前驱图进程的同步与互斥PV操作一般来说，信号量S>=0时，S表示可用资源的数量。执行一次P操作意味着请求分配一个单位资源，因此S的值减1；当S<0时，表示已经没有可用资源，请求者必须等待别的进程释放该类资源，它才能运行下去。而执行一个V操作意味着释放一个单位资源，因此S的值加1；若S£0，表示有某些进程正在等待该资源，因此要唤醒一个等待状态的进程，使之运行下去。例题例题2...
2021-10-24 15:28:14
124
原创 js map
map() 方法创建一个新数组，其结果是该数组中的每个元素都调用一个提供的函数后返回的结果。var array1 = [1,4,9,16];const map1 = array1.map(x => x *2);console.log(map1);//打印结果[2,8,18,32]var array1 = [1, 4, 9, 16]; const map1 = array1.map(x => { if (x == 4) { return x * 2;
2021-10-17 10:09:21
339
原创 eladmin按钮权限分配超详情很简单checkPermission和v-permission的区别
前言在最近的项目中，有对于不同用户分配不同权限的需求，以前写的时候知识跟着用，这次按照 登录-刷新-验证 打算自己去看一遍（使用element-ui）上文总结另一篇按钮权限分配我们说到了 v-permission 的用法和执行过程，先来个小总结对于管理员如果要让管理员拥有对某个表格的增删改权限只需要在表格 v-permission 列表中添加 ‘admin’ 字段就可以了<el-table-column v-permission="['admin', 'user:edit', '
2021-10-10 10:30:59
3577
1
原创 eladmin按钮权限分配超详情很简单
前言在最近的项目中，有对于不同用户分配不同权限的需求，以前写的时候知识跟着用，这次按照 登录-刷新-验证 打算自己去看一遍（使用element-ui）话不多说，本文我分为两个角色去瞅一眼管理员登录在login.vue页面handleLogin() { this.$refs.loginForm.validate((valid) => { console.log(valid) const user = { username:
2021-10-03 18:43:53
1492
1
原创 canvas前端生成海报、二维码、截取节点生成图片
前言在最近的项目中，有一个需求是要保存前端生成的二维码，同时需要在二维码上方显示课程名称或者活动名称，下方显示机构名称这次前端分为PC管理端和uniapp移动端PC端计划使用qrcode生成二维码，然后再用 html2canvas 将二维码和标题、机构名称html元素保存成图片移动端计划使用DCloud提供的 uni-qrcode 组件来生成二维码，然后使用 mosowe-canvas-image 来保存成图片为什么使用qrcode而不用vue-qrvue-qr可以在二维码中间加logo
2021-09-06 09:48:18
903
原创 ELadmin使用vuex来存储用户信息以及自定义存储信息的时机
前言在最近的项目中，有需求要点击校区选择器框后动态显示现有校区选项（使用element-ui）对于这个需求有两个解决的思路：使用eladmin提供的“新增和编辑之前钩子”()[CRUD.HOOK.beforeToCU](crud, form) { this.getTeacherAndCate()}async getTeacherAndCate() { await getTeacher() .then((res) => { this.teachO
2021-09-05 20:46:18
374
原创 axios回调函数的调用顺序
axios拦截器一 axios.create(config)根据指定配置创建一个新的 axios, 也就就每个新 axios 都有自己的配置新 axios 只是没有取消请求和批量发请求的方法, 其它所有语法都是一致的为什么要设计这个语法?(1) 需求: 项目中有部分接口需要的配置与另一部分接口需要的配置不太 一样, 如何处理(2) 解决: 创建 2 个新 axios, 每个都有自己特有的配置, 分别应用到不同要求的接口请求中拦截器函数/ajax请求/请求的回调函数的调
2021-09-05 10:47:39
2569
原创 ES6数值扩展
Number.EPSILON 是 JavaScript 表示的最小精度//EPSILON 属性的值接近于 2.2204460492503130808472633361816E-16function equal(a, b){ if(Math.abs(a-b) < Number.EPSILON){ return true; }else{ return false; }}console.log(0.1 + 0.2 === 0.3);false
2021-08-29 14:37:09
85
原创 uniapp中组件的基本使用和数据绑定
组件的基本使用uni-app提供了丰富的基础组件给开发者，开发者可以像搭积木一样，组合各种组件拼接称自己的应用uni-app中的组件，就像 HTML 中的 div 、p、span 等标签的作用一样，用于搭建页面的基础结构text文本组件的用法001 - text 组件的属性属性类型默认值必填说明selectablebooleanfalse否文本是否可选spacestring.否显示连续空格，可选参数：ensp、emsp、nbspdecodeb
2021-08-22 14:15:04
1323
原创 vue2和vue3的响应式对比
vue2和vue3的响应式对比vue2.x的响应式实现原理：对象类型：通过Object.defineProperty()对属性的读取、修改进行拦截（数据劫持）。数组类型：通过重写更新数组的一系列方法来实现拦截。（对数组的变更方法进行了包裹）。Object.defineProperty(data, 'count', { get () {}, set () {}})存在问题：新增属性、删除属性, 界面不会更新。直接通过下标修改数组, 界面不会自动
2021-08-15 17:21:59
223
原创 docker-compose部署springboot+vue前后端分离项目 超简单
为什么选用docker-composeCompose 是用于定义和运行多容器 Docker 应用程序的工具。通过 Compose，您可以使用 YML文件来配置应用程序需要的所有服务。然后，使用一个命令，就可以从 YML 文件配置中创建并启动所有服务。简单就是说，docker-compose部署是真滴简单，再也不用去求人找脚本了。两个文件加一行命令，快乐不求人！那我为什么选择docker-compose因为我是一位垃圾，写shi山的前端，不，是页面开发人员（不配）所以我只想简单快速地把我的东西
2021-07-31 22:21:47
916
原创 vue前端部署
为什么选择使用nvm？我们可能需要在服务器部署多个前端项目，而不同的项目所使用的node版本又是不一样的，不同版本的node的兼容性是不一样的。这种情况下，对于维护多个版本的node将会是一件非常麻烦的事情，而nvm就是为解决这个问题而产生的，他可以方便的在同一台设备上进行多个node版本之间切换。一、项目根目录1.使用Dockerfile构建镜像# 依赖centos环境FROM centos:latest#安装vim、git和nvm环境RUN yum -y update \ &a
2021-07-25 11:38:57
532
2
原创 springboot项目部署
1、Dockerfile创建docker镜像FROM centos:latestRUN yum -y update \ && yum -y install vim \ && yum -y install git \ && yum -y install java-1.8.0-openjdk-devel.x86_64 \ && yum install -y maven \ && mkdir
2021-07-11 11:19:45
74
原创 nginx配置手机端和PC端多个vue项目
背景一个后端服务。一个手机端，一个pc端（vue项目）。方案一：起两个端口手机端vue项目写一个server，PC端在写一个server二：起别名1.在第一个手机端vue项目中 vue.config.js 设置publicPathmodule.exports = { publicPath: '/front/', outputDir: 'dist', // 打包目录2. 在 router/index.js中更改 //路由配置const router = new
2021-06-23 09:46:23
514
原创 nginx 报错upstream prematurely closed connection while reading response header from up
环境Nginx Centos7 （学校服务器）错误最近访问突然报502，重启 + 重新配置nginx.conf也无效然后去查看nginx/logs/error.log 发现一访问项目就报下面错翻译：从上游读取响应头时上游过早关闭的连接翻博客一：传输数据过多传输数据过多，其实是header过大的问题，杀掉9000端口后面通过杀掉windows 9000端口进程就好了1、打开windows CMD窗口两步方法 : 1 查询端口占用,2 强行杀死进程二：关闭长链接如果系统并
2021-06-23 09:13:43
8350
原创 Spring中bean的四种注入方法
Spring中bean的四中注入方法Set方法注入如果我们需要使用set注入，那么必须要为属性提供set方法，Spring容器就是通过调用bean的set方法为属性注入值的。而在xml文件中，使用set注入的方式就是通过property标签<!-- 定义car这个bean，id为myCar --><bean id="myCar" class="cn.tewuyiang.pojo.Car"> <!-- 为car的属性注入值，因为speed和pri
2021-06-07 13:23:59
1104
原创 Scannner类和printf
Scanner类java.util.Scanner 是 Java5 的新特征，我们可以通过 Scanner 类来获取用户的输入。下面是创建 Scanner 对象的基本语法：Scanner s = new Scanner(System.in);接下来我们演示一个最简单的数据输入，并通过 Scanner 类的 next() 与 nextLine() 方法获取输入的字符串，在读取前我们一般需要 使用 hasNext 与 hasNextLine 判断是否还有输入的数据：使用 next 方法import
2021-05-30 09:45:15
164
原创 uniapp中不能使用$ref
unipp中不能使用$ref有一个需求，v-for遍历出来的元素要加一个唯一的标识。当点击其中一个时，改变被点击元素的样式。我打算用ref加上 :key 绑定的值来做标识，但是当我打印的时候，显示的是undefined。在这里，我绑定ref 用 内层循环 :key 绑定的 i 和外层循环 :key绑定的 x 一起作为唯一标识。但是并没有用，请看下图。在这里我打印了 “this.$refs” 并没有找到。解决方法使用组件从打印出来的 “this.refs"中可以看到，里面其实是有东西的这些
2021-05-02 20:08:30
3687
1
原创 redis存读
Redis的数据库Redis 对数据库进行了抽象，在 Redis 源码中，承担数据库角色的叫 redisDb。我们暂且无需去了解 redisDb 的内部结构，我们可以站在一个更加宏观的角度去初步了解它，这样能得到一个更全局的认识。 Redis服务可以同时配置多个 redisDb，每个redisDb的数据是相互隔离的。那么怎么配置多个 redisDb 呢？有过 redis 实战经验的同学肯定会说，这太简单了，我们只需要在 redis 的配置文件中配置 databases 即可。redis 默认配置的
2021-04-25 14:49:40
125
原创 vue刷新当前页面
1.整个页面重新刷新//第一种location.reload()//第二种this,$router.go(0)2.新建一个空白页，然后再跳回来this.$router.replace({ path: ""})3.provide/inject组合使用
2021-04-18 12:35:19
90
原创 springboot+security实现权限认证
springboot+security实现权限认证Spring Security是一个能够为基于Spring的企业应用系统提供声明式的安全访问控制解决方案的安全框架。它提供了一组可以在Spring应用上下文中配置的Bean，充分利用了Spring IoC，DI（控制反转Inversion of Control ,DI:Dependency Injection 依赖注入）和AOP（面向切面编程）功能，为应用系统提供声明式的安全访问控制功能，减少了为企业系统安全控制编写大量重复代码的工作。它是一个轻量级的
2021-04-11 14:15:14
739
原创 uniapp保存图片到本地
uniapp保存图片到本地uniapp官方文档因为要做一个生成二维码并可以打印出来的功能，所以需要把做好的二维码显示出来并能保存到本地图库在uniapp官方文档中是这样写的uni.chooseImage({ count: 1, sourceType: ['camera'], success: function (res) { uni.saveImageToPhotosAlbum({ filePath: res.tempFilePaths
2021-03-28 14:24:03
2636
1
原创 理解JavaScript的async/await
async/await理解JavaScript的async/awaitasync起什么作用await在等待什么await等到了之后async/await帮我们干了啥做个比较async/await的优势在于处理then链理解JavaScript的async/await任意一个名称都是有意义的，先从字面意思来理解。async 是“异步”的简写，而 await 可以认为是 async wait 的简写。所以应该很好理解 async 用于申明一个 function 是异步的，而 await 用于等待一个异步方法
2021-03-14 08:14:20
113
原创 利用set去重原理实现对象列表去重
set去重原理set去重原理大家都知道，set()自带天然去重，例如自定义一个类测试发现改造去重原理set去重原理大家都知道，set()自带天然去重，例如 Set<String> set = new HashSet<String>(); set.add("aaa"); set.add("bbb"); set.add("aaa"); set.add("ccc"); System.out.println(set); 它的输出结果为：[aaa, ccc, bb
2021-02-19 22:43:09
586
原创 ELadmin后台日志学习收获
SMPE日志后台首先我们来看页面效果增删改导出按钮是怎么控制显示的图中红色框内有两个按钮，控制显示哪些的部分在下图在页面中引入了CRUD.operation，里面有新增，修改，删除，导出按钮，搜索，重置按钮方法，以及预留左侧右侧的具名插槽供使用者自己添加按钮。在页面的created方法里，进行this.crud.optShow对象的赋值created() { this.crud.optShow = { add: false, edit: false,
2021-01-29 16:13:13
624
2
原创 vant组件使用小总结
button按钮按钮类型按钮支持 default、primary、info、warning、danger 五种类型，默认为 default。<van-button type="primary">主要按钮</van-button><van-button type="info">信息按钮</van-button><van-button type="default">默认按钮</van-button><van-button
2021-01-23 21:44:52
11367
原创 java内存分配机制
java内存分配机制内存分配，主要指的是在堆上的分配，一般的，对象的内存分配都是在堆上进行，但现代技术也支持将对象拆成标量类型（标量类型即原子类型，表示单个值，可以是基本类型或String等），然后在栈上分配，在栈上分配的很少见，我们这里不考虑。Java内存分配和回收的机制概括的说，就是：分代分配，分代回收。对象将根据存活的时间被分为：年轻代（Young Generation）、年老代（Old Generation）、永久代（Permanent Generation，也就是方法区）。年轻代（Yo
2020-11-08 11:43:08
313
原创 SpringBoot整合MyBatis注解版
整合MyBatis1.在pom中导入依赖 <dependency> <groupId>org.mybatis.spring.boot</groupId> <artifactId>mybatis-spring-boot-starter</artifactId> <version>1.3.1</version> </dependency>2.在application.yml中在res
2020-08-23 09:16:39
128
原创 Mybatis使用注解一对一，一对多，多对多
mybatis的概述mybatis是一个持久层框架，用java编写的。它封装了jdbc操作的很多细节，使开发者只需要关注sql语句本身，而无需关注注册驱动，创建连接等繁杂过程它使用了ORM思想实现了结果集ORM：Object Relational Mappging 对象关系映射简单的说：就是把数据库表和实体类及实体类的属性对应起来让我们可以操作实体类就实现操作数据库表。Mybatis环境搭建• 创建maven工程并导入坐标 <dependency>
2020-08-16 10:54:23
1408
原创 mybatis注解动态sql limit like
写在前面在用mabatis的时候是觉得已经很方便了，但是碰到动态的sql语句，就有点蒙了，昨天刚写完我的动态sql，遇到了不少问题，百度了很多波，好多文章对于like limit涉及的不是很多。在这里做一下记录问题背景我需要在下面这张表里，根据 pname 和 typeId 查找这张表里的数据。可是pname 这个字段我是不一定每次都会有的select count(*) from product where typeId = #{typeId} (and pname like #{pname})/
2020-08-10 08:42:36
1444
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人