- 博客(65)
- 资源 (2)
- 问答 (1)
- 收藏
- 关注
RSS订阅原创 使用svg-captcha从后端拿取一个图形验证码
svg-captcha安装npm install -S svg-captcha引入模块import svgCaptcha from ‘svg-captcha’使用const captcha = new svgCaptcha({})参数
2020-05-14 12:25:22
1564
原创 玩转canvas之实现一个圆角矩形
使用canvas封装一个绘制圆角矩形的方法代码原理思路分析讲解缺陷改进改进圆角非正规圆角的问题改进后的代码实现的圆角改进圆角过大的问题总结完整代码在canvas中绘制一个矩形是非常简单的，使用canvas的rect()方法即可，但是没有办法绘制一个带圆角的矩形，如图：代码class DrawBoard extends BasicCanvas{ constructor(c){ super(c) } // 如何绘制带圆角的矩形 createRect(x,y,w,h,r = 0,{
2020-05-10 23:01:28
2743
2
原创 玩转canvas之drawImage()与方法封装
封装drawImage方法drawImage()方法讲解实际原理关系图代码封装增加传入图片的方法优化参数设置总结drawImage()方法讲解drawImage方法总体并不是很难理解，这个方法总共有九个参数drawImage(img, sx, sy, sw, sh, x, y, w, h)img - 是传入的img对象（注意这里是图片对象，并且是已经加载完成的那种）sx - 剪裁图片的起始x坐标sy - 剪裁图片的起始y坐标sw - 剪裁图片的宽度sh - 剪裁图片的高度x - 在画布中
2020-05-09 00:41:48
984
原创 玩转canvas之文字样式封装
文字样式与绘制封装设置文本样式方法代码封装绘制文本方法示例与图像示例图像总结封装设置文本样式方法代码该方法主要用于设置文本的大小，字体，对齐方式和基线等基础样式fontStyle(size, family, align, baseline){ let ctx = this.ctx let font = ctx.font.split(" ") size > 0 ? font[...
2020-05-08 00:48:55
669
原创 玩转canvas之封装设置渐变色
封装渐变色设置方法设置渐变色代码使用示例图像总结设置渐变色代码class EasyCanvas{ // 设置环形渐变色 radialGradient(x1,y1,r1,x2,y2,r2,color){ // x1,y1,r1分别是起始圆的中心点与半径 // x2,y2,r2分别是结束圆的中心点与半径 // color是用于设置渐变色 let grd = this.ctx....
2020-05-05 21:03:35
221
原创 玩转canvas之封装线条样式与阴影方法
封装线条样式与阴影方法封装设置线条样式方法代码使用示例图像封装设置阴影方法代码使用示例图像总结封装设置线条样式方法代码// 设置线条样式class EasyCanvas { constructor(c){ this.cav = c this.ctx = c.getContext('2d') } lineStyle(width, cap, join, miter){ let...
2020-05-04 12:40:19
1402
原创 玩转canvas之路径api封装
代码纠错这里纠正一下上一篇《玩转canvas之前期准备和封装绘图方法》的一个错误在封装api的绘制路径stroke方法的时候，在对笔触颜色进行赋值的时候出现了一点错误，写成了color ? ctx.stroke = color : null这样会导致调用这个方法错误，现已纠正，正确的写法应该是color ? ctx.strokeStyle = color : null封装常规路径...
2020-05-03 13:47:24
251
原创 玩转canvas之前期准备和封装绘图方法
前期准备和封装绘图方法前期准备整体思路目录结构链式操作构建实例化函数实例化函数封装绘图方法前期准备要封装canvas，首先需要对其的方法api有一个全局的认识canvas的主要方法主要有以下几类线条样式 lineStyle笔触颜色 color阴影 shadow矩形 rect路径 path转换 transform文本 font图像 img像素操作 imgData合成 co...
2020-05-02 13:34:39
582
原创 node连接/操作oracle数据库 — oracledb
oracledb模块的基础使用oracledb介绍环境准备node环境以及npm环境oracle环境python环境oracledb的使用oracledb基础项目安装oracledb模块引入oracledb模块oracledb模块基础讲解封装oracledb封装oracle连接封装oracle查询封装oracle断开使用oracledb介绍oracledb是nodejs中一个可以连接和操作o...
2020-04-22 14:31:24
1674
原创 微信小程序之缓存
微信小程序的缓存机制简单使用1. 设置缓存用法参数2. 获取缓存用法首先这里仅记录学习微信小程序的简单使用，主要用于学习和巩固。微信的缓存与web浏览器的localstorage有异曲同工之妙，是永久存储在浏览器或者手机端的缓存机制。1. 设置缓存用法异步存储语法：wx.setStorage(key, value);同步存储语法：wx.setStorageSync(key, value...
2020-04-08 19:02:25
1984
原创 说说关于vue-router的那些事
说说关于vue-router的那些事路由的初始配置引入vue-router实例化并挂载路由实例化路由配置挂载路由路由的简单使用配置路由接口组件router-linkthis.$routerrouter-view路由的高级使用动态路由路由嵌套命名视图传参解耦如果有想看实例的童鞋可以去我的资源里面下载vue-router资源，该文章主要参考了vue-router官方文档，和vue官方文档路由的初始...
2020-04-08 18:44:37
188
原创 window系统使用ssh连接远程服务器
window系统使用ssh连接远程服务器准备本地创建并配置ssh密钥第一步：创建ssh密钥第二步：创建config文件并配置相关信息配置远程服务器查看sshd服务的端口新增ssh端口删除ssh端口重启sshd服务配置远程服务器密钥配置环境变量关于window系统使用ssh连接远程服务器的方法，上网查了一下感觉还是比较混乱，这里结合学习的内容来总结一下window上使用ssh密钥连接远程的服务器的...
2020-04-05 11:05:42
11861
3
原创 Linux常用指令操作
Linux常用指令操作Linux内核和磁盘占用lsb_release -auname -adf / df -THdfdf -TH文档型指令cd 目录lsls -lamkdir <目录名称>touch <文件名>vi <文件名>进入编辑模式退出编辑模式保存文件不保存文件cat <文件名>echo追加内容覆盖rm删除文件删除目录功能型指令wg tar压缩...
2020-04-04 12:01:12
911
原创 事务打卡之登录注册页面编写
页面编写一消除#登录页面消除#在使用vue-router的时候发现url地址中需要加上/#/，这样不太美观和不方便我们可以在路由配置中设置mode属性为history就可以去掉#登录页面...
2020-04-03 00:42:47
376
原创 利用Vue-CLI创建vue项目和安装vant包
创建Vue项目Vue-CLI创建项目命令拉取旧的模板安装中出现的警告运行项目安装vant模块Vue-CLI使用vue脚手架，需要先全局安装vue脚手架npm install -g @vue/cli创建项目命令vue create [options] <app-name>根据vue-cli官方文档，该命令创建的是新版的vue模板，但该项目选用vue2.x的模板，所以需要拉去2...
2020-04-02 00:03:45
736
原创 短期目标之需求分析
项目名称：事务记录打卡webapp项目描述：主要是用于练手的项目，主要用于用户每日打卡，添加事务、完成事务，查看事务等功能项目页面分析：登录/注册页面打卡页面（打卡已经打卡成功）事务列表的展示页面事务完成提交页面个人中心页面功能分析：前端框架：vue，使用vue脚手架来快速生成vue项目UI框架：vant，由于这个主要是移动端的项目所以这里使用vant...
2020-04-01 00:10:02
300
原创 前端学习之自我规划
自我提升规划1. 前言2. 系统化2.1 目标2.1.1 长期目标2.1.2 短期目标2.2 学习规划2.2.1 学习路线规划2.2.2 学习时间规划2.2.3 提升学习效率2.3 巩固我的系统化学习长期目标短期目标学习路线1. 前言作为跨专业学习前端大军中的一员。深知跨专业找工作的困难，没有相应的专业支撑，没有对应的项目经验，也没有成体系的知识架构。往往在找工作这一关口就耗尽所有力气。目前为...
2020-03-31 00:08:40
3016
原创 微信小程序之bind和catch
微信小程序bind和catch事件bind-冒泡事件catch-非冒泡事件事件我们知道在web浏览器中，可以用事件来监听用户的动作，比如click、mouseup、mousemove、keypress等事件。且事件执行的顺序是先捕获后冒泡。因此在js事件中我们常常会因为需求对事件进行阻止事件的捕获或者冒泡，那么同样的，在微信小程序的事件中，同样有冒泡与非冒泡事件bind-冒泡事件冒泡的意思...
2020-03-17 22:38:00
1509
原创 iconfont矢量图标库的用法
iconfont矢量图标库的用法在日常开发的时候，我们都必不可少的需要使用各式各样的图标来进行页面的渲染，最近学习到了关于iconfont的使用方法，以此博客来记录。1、创建一个iconfont项目首先我们需要进入iconfont官网，登陆进去后点击图片管理 -> 我的项目然后我们点击填写相应的信息即可创建一个iconfont项目，并进行管理2、添加icon到项目中到商城...
2020-02-27 00:07:34
1008
原创 VUE组件基础随笔
vue组件基础知识组件示例特点结构组件名datatemplate传递参数示例props传递静态参数传递动态参数监听子组件事件示例组件示例组件是一个可以复用的vue实例，语法是：javascriptVue.component('component-name', { data: function(){ return { name: "vimin" } }, templat...
2020-01-06 23:07:21
199
原创 原生JS实现复制图片和文本内容
关于JS操作剪贴板的那些事原生JS实现复制Range介绍使用getSelection介绍使用execCommandcopy代码最近开发上有个需求是要实现一键复制图片的功能，查阅了相关资料后发现有几种可以实现的方式，但总体而言网上的信息都较为零散，所以这里总结一下自己最近的心得，有需要的可以借鉴一下。原生JS实现复制这种方式主要使用到了几个比较重要的知识点，分别是range、selection...
2020-01-06 00:49:33
2390
原创 vue基础知识
一、引入vue的几种方法：1、script引入：直接引入vue官网的vue.js文件，这里我使用的是学习版本：<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>;2、npm安装：通过npm包管理软件来安装vue，一般适用构建项目，npm install vue；二、创建v...
2019-12-11 22:50:27
162
原创 函数防抖以及函数节流
函数防抖以及函数节流实际上是对某些操作太过频繁的js操作进行一定的限制，使其在某段时间内仅执行一次的操作，可以帮助我们优化代码执行的效率性。函数防抖防抖：在某段规定的时间时候后，若没有再次触发该函数，则执行其中的回调函数我们来举个栗子：document.onresize = function(){ console.log('s') }当我们改变浏览...
2019-08-09 13:28:23
133
原创 实现元素水平垂直居中的方法
实现单个元素水平垂直居中的方法，在查阅了相关的资料后，进行了相应的整合方法一：使用position定位和margin移位这是一种最为普通的居中方法。但前提是知道元素确定的宽和高的数值假设有一个100*100的div，实现水平垂直的代码是：div{ width: 100px; height: 100px; background: red;}div...
2019-08-06 15:35:08
178
原创 async/await 学习心得以及要点
async/await 学习心得以及要点async/awaitasync/await 是es6中新增的异步加载方式，是一种比promise异步加载更加方便，代码更为简洁的方法，而且可以结合promise一起使用。async关键字我们只需要将async关键字加到function前面就可以声明一个async函数了async function test(){ return...
2019-08-01 11:03:58
217
node使用mssql连接sql server数据库报错code：ESOCKET
2021-04-08
TA创建的收藏夹 TA关注的收藏夹
TA关注的人