- 博客(31)
- 资源 (1)
- 收藏
- 关注
RSS订阅原创 VUE项目中使用prettier在git 提交前对代码进行格式化处理，统一代码格式
VUE项目中使用prettier在git 提交前对代码进行格式化处理，统一代码格式prettier是一个代码风格管理工具，它能够解析代码，使用你自己设定的规则来重新打印出格式规范的代码。在代码提交之前，进行代码规则检查能够确保进入git库的代码都是符合代码规则的。但是整个项目上运行lint速度会很慢，lint-staged能够让lint只检测暂存区的文件，所以速度很快。安装在使用前，先安装 lint-staged 与 prettier//npmnpm install --save lint-st
2021-12-14 13:50:28
2027
2
原创 vue项目中优雅的导入全局过滤器
vue项目中优雅的导入全局过滤器在项目src目录下创建一个filters目录，用来放全局的过滤器[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-MYjHWD9z-1639378809904)(http://ptf.chao-yu.cn/blog/2021/09/28/8f4663edbd7e10458892de709e16abb7-cc3587.png)]在filters目录下创建index.js文件例如，创建两个测试过滤器/** * 测试filter * @pa
2021-12-13 15:00:35
707
原创 es6中新增的数组的扩展运算符...
es6中Array对象的扩展运算符…的使用es6中Array对象中新增的扩展运算符 …,将一个数组转为用逗号分隔的参数序列基本使用console.log(...[1,2,3])// 1 2 3函数传参function add(x,y){ return x+y;}let arr = [4,5];let num = add(...arr);console.log(num);//9合并多个数组let a = [1,2,3];let b = [2,3,4];let
2021-08-12 11:03:10
242
原创 正则表达式中的贪婪匹配与懒惰匹配
正则表达式中贪婪匹配与懒惰匹配的概念贪婪匹配匹配尽可能多的字符当正则表达式中包含能接受重复的限定符时，默认会尽可能多的去匹配更多的字符，这种匹配模式叫做贪婪匹配懒惰匹配匹配尽可能少的字符在有重复限定符时，在重复限定符后加 ? 可转化为懒惰匹配例如：匹配html标签在贪婪匹配下，会尽可能多的匹配字符，一直到字符串的结尾在懒惰匹配下，会找到第一个以<开头>结尾的字符，尽可能短的去匹配...
2021-08-12 11:01:48
469
原创 js数组常用方法整理
js中数组常用方法整理concatconcat用于连接（合并）两个或更多的数组let a = [1,2,3];let b = [2,3];let c = [4];console.log(a.concat(b,c));//[1, 2, 3, 2, 3, 4]filterfilter用户对数组进行筛选，筛选出符合条件的选项，返回一个新的数组let persons = [ {name:"张三",age:20}, {name:"李四",age:18}, {name:"王五",age:2
2021-08-12 11:00:04
145
原创 正则表达式学习
正则表达式学习总结限定符*、+、？、{n}、{n,}、{n,m}a* 匹配a出现0次或多次a+ 匹配a出现1次或多次a? 匹配a出现0次或一次a{n} 匹配a出现n次a{n,} 匹配a至少出现n次a{n,m} 匹配a至少出现n次，最多出现m次或运算符|a|b 匹配a或者b(ab)|(cd) 匹配 ab或者cd字符类[abc]、[^abc]、[a-z]、[A-Z]、[0-9][abc] 匹配方括号中的任意字符，a或者
2021-08-05 13:37:40
1677
原创 js中判断当前网络是否连接
javascript中判断当前客户端网络是否连接,可以使用 window.navigator.onLine 来判断if(window.navigator.onLine){ console.log("在线");}else{ console.log("离线");}监听当前网络连接状态可以使用 window.addEventListener//注意，初始状态下不会出发，只有当网络状态变化才会出发window.addEventListener("offline",function(e){ con
2021-08-03 14:37:11
1954
原创 理解与使用Promise.all 与 Promise.race
es6中Promise对象的 all方法与race方法使用Promise.allPromise.all()方法用于将多个 Promise 实例，包装成一个新的 Promise 实例,同时，成功和失败的返回值是不同的，成功的时候返回的是一个结果数组，而失败的时候则返回最先被reject失败状态的值。例如：创建两个都会返回成功的Promise,调用Promise.all方法，会在所有结果都返回成功之后返回结果数组，并且，结果数组的顺序与all方法传入的顺序相同let p1 = new Promise
2021-08-03 11:37:33
717
原创 windows下使用git小乌龟（TortoiseGit）来代替git命令，git小乌龟安装使用流程
git小乌龟安装使用流程点击前往TortoiseGit 下载地址 选择 64位版本下载，下载完成后打开安装包，一路next 即可下载对应版本的中文语言包选择对应版本的 64位简体中文语言包下载下载完成后双击运行，一路next，最后一步 选择应用到语言中安装完成之后，在项目跟目录点击鼠标右键，就可以使用 git 小乌龟去操作git了...
2021-08-03 11:34:40
2555
原创 js中防抖与节流的概念理解以及应用场景
js中防抖与节流的概念理解以及应用场景防抖在开发中，如果需要监听滚动条滚动事件，或者输入框输入事件等高频事件时，如果每次都触发具体的操作的话，会使浏览器变的卡顿，影响用户体验，高频率触发ajax接口，更会增加服务器负荷防抖的概念持续触发事件时，在设定的事件内没有被再次触发，才会去调用事件处理函数，如果在设定时间内又被触发了，则不调用事件处理函数，并重置设定时间，重新开始延迟防抖的实现例如：在用户进行实时搜索的场景下，每次用户输入都会发起ajax请求，获取搜索结果，下面代码展示了<!D
2021-08-03 11:31:38
242
原创 前端使用 xlsx 读取复杂excel 文件，例如，设置从第几行开始读取、空数据设置默认值
前端开发中使用xlsx读取excel文件内容时，有时候我们要跳过excel 文件里某一行的内容，或者对空数据设置默认值时，可以参考如下操作
2021-04-19 14:42:08
7960
3
原创 js中判断一个变量是否是数组的方法整理
在js中，我们可以使用 typeof 对一些常用类型进行判断，比如：Function、Object、number、String、undefined 等但是，在使用typeof对数组、或者null进行判断时，都会返回Object下面，整理下常用的可以判断Array类型的方法1、instanceofinstanceof操作符是检测对象的原型链是否指向构造函数的prototype对象的let a = [2,543,32];console.log(a instanceof Array);// true
2021-03-16 13:55:51
443
原创 ＜script＞ 与 ＜script async＞ ＜script defer＞ 的区别
在向html页面中插入js脚本我们主要用 script 标签来引入，那么 script 标签加 async与 defer属性有什么区别呢
2021-03-09 14:13:20
660
原创 vue-cli4 项目下使用cdn引入静态资源，减少打包生成的js、css文件体积，优化页面打开速度
在项目开发中我们常用到的一些类库，例如vue、elemenu-ui、axios、vue-router等等这些不长更改的文件，可以在vue.config.js里做下cdn配置
2021-03-05 17:42:40
1014
原创 推荐一个node QQ机器人框架-onebot
onebot-github链接已集成测试功能完善，加群测试交流文档可以参考github，这里不做过多赘述附带api截图
2021-03-03 14:00:05
4488
原创 js判断字符串中是否包含某个字符方法整理
整理js中可以用到的判断一个字符串中是否包含另外一个字符的方法String对象方法1、indexOfindexOf 返回指定字符串在该字符中首次出现的位置，如果没有找到，则返回 -1indexOf 接收两个参数，第一是需要搜索的字符串，第二个参数是检索的位置，默认为0let str = 'abcde';//例如，从str第三位开始搜索 'a'console.log(str.indexOf('a',2));// -1console.log(str.indexOf('a'))// 02、
2021-02-25 14:52:49
37213
原创 node-sass下载失败报错解决方案
在vue-cli开发环境下，npm install 遇到node-sass下载失败的情况，整理了如下解决方案
2021-02-24 11:26:45
550
1
原创 uniapp自定义环境配置开发环境、测试环境、生产环境接口请求域名
使用uniapp框架在进行项目开发过程中，uniapp默认可以判断生产环境和开发环境，如果我们需要再多配置几个环境的话，就需要进行自定义配置
2021-02-22 12:00:13
25946
6
原创 vue-cli4 开发项目中开启gzip压缩，优化打包体积，提升加载速度
在vue-cli4开发环境下完成项目开发后，我们在编译部署项目的时候可以使用compression-webpack-plugin对打包后的js、css等文件进行gzip压缩，以提升项目加载速度开发环境搭建可参考node开发环境搭建vue-cli4开发环境搭建使用流程引入compression-webpack-pluginnpm i -D compression-webpack-plugin在 vue.config.js中配置 （vue-cli4脚手架创建的项目默认没有这个文件，自己在项目根
2021-02-20 11:57:05
2815
4
原创 vue-cli4安装及项目搭建
开始安装之前，请确保你已经安装过nodejs环境了，如未安装过node,可参考使用nvm管理node版本，安装node开发环境，这篇文章进行安装安装vuecli4如果你之前已经安装过vue-cli，先执行以下命令，卸载老版本，未安装请忽略npm uninstall -g vue-cli安装：npm install -g @vue/cli安装完成后执行 npm -V 或者 npm – version查看当前vuecli版本创建项目npm建议切换为淘宝镜像,创建项目会快一点创建项目执行
2021-02-19 13:48:11
653
原创 windows下配置npm淘宝镜像
因为npm服务器在国外的原因，导致我们在开发过程中使用npm下载一些第三方包的时候很慢，或者会下载失败，在使用中配置为淘宝镜像可方便的解决这个问题永久配置方法：命令行输入npm config set registry https://registry.npm.taobao.org/单次使用：在npm install命令后添加这一段--registry=https://registry.npm.taobao.org//例如npm install axios --registry=https:
2021-02-19 13:24:24
1250
1
原创 axios介绍以及使用流程
axios是一个可以同时在客户端以及node服务端同时使用的ajax库，同时也是vue2.x中推荐使用的ajax库，可以拦截请求和相应、取消请求、同时发起多个请求等操作使用流程npm install axios //下载axios包发送get请求//参数直接拼在url后面axios.get('/getlist?tid=1').then((res)=>{}).catch((err)=>{})//或者另外一种写法axios.get('/getlist',{ para
2021-02-18 17:37:25
685
原创 js中call和apply的用法和区别
javaScript 中通过call或者apply用来代替另一个对象调用一个方法，将一个函数的对象上下文从初始的上下文改变为指定的新对象。简单的说就是改变函数中this的指向基本用法function Fun(){ this.name = "fun"; this.say = function(){ console.log(this.name); console.log(arguments); }}let people = { name:"test"}let f = new Fu
2021-02-18 17:31:02
217
原创 uniapp介绍以及项目创建
uni-app 是一个使用 Vue.js 开发所有前端应用的框架，开发者编写一套代码，可发布到iOS、Android、Web（响应式）、以及各种小程序（微信/支付宝/百度/头条/QQ/钉钉/淘宝）、快应用等多个平台。官网地址创建项目下载HBuliderX编辑器下载地址创建项目选择uniapp项目选择运行方式运行开发完成之后选择发行到某端...
2021-02-18 17:10:53
826
原创 nodejs开发一个爬虫应用
使用cheerio模块来爬取网页上的内容首先，确保你已经安装了node，如果没有，可以参考node开发环境搭建初始化项目新建一个文件夹，目录名随便起一个,在根目录下执行//初始化package.json文件npm init//引入cheerio模块npm install cheerio --save//引入定时任务模块npm install node-schedule --save//引入axiosnpm install axios --savecheerio 模块介绍chee
2021-02-18 17:03:53
261
原创 uniapp开发app中配置高德地图定位流程
在使用uniapp开发app过程中，如何使用高德地图进行定位高德地图开放平台账号申请进入高德地图开放平台，注册并登陆开发者账号，完成之后点击进入控制台主页在应用管理中点击创建新应用输入并选择你的应用类型，创建完应用后，添加key选择并输入你的应用信息key名称可以自定义填写服务平台选择（这里以）安卓为例填写安全码、应用包名等信息，完成后提交创建完成之后拿到生成的key项目文件中配置高德定位HBuliderX编辑器中，在项目根目录打开manifest.json这个文件APP模
2021-02-18 14:12:25
7463
9
原创 uniapp开发app过程中集成友盟统计
uniapp在开发app过程中，需要集成友盟统计，可参考以下流程进行配置友盟统计官网注册并获取appkey单独创建安卓跟ios的应用，获取到appkey(这里以安卓为例)配置manifest.json文件1.打开APP模块配置，勾选友盟统计2.打开源码视图因为HBuliderX现在不支持图形化界面直接填入友盟统计的appkey等参数，所以需要打开源码视图手动去添加友盟统计相关参数在sdkConfigs 配置下增加statics （下图中显示的只是安卓的配置）安卓、ios全部配置格式为
2021-02-18 14:04:54
3386
4
原创 使用nvm管理node版本，安装node开发环境
使用nvm可以让你在一台机器上安装多个nodejs版本，并且可以灵活的在各个node版本以及对应的npm版本之间进行切换安装nvmnvm最新下载地址https://github.com/coreybutler/nvm-windows/releases在最新版本下，选择下图中红框中的压缩包下载，解压后安装即可验证nvm是否安装成功打开cmd窗口，输入nvm -v,如有版本提示，则证明安装成功了在安装nodejs前，可以选择配置nvm淘宝镜像，这样下载会快一点nvm淘宝镜像配置首先，打开cm
2021-02-18 13:57:17
240
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人