- 博客(24)
- 资源 (1)
- 收藏
- 关注
原创 常用正则表达式
一、校验数字的表达式1 数字:^[0-9]*$2 n位的数字:^\d{n}$3 至少n位的数字:^\d{n,}$4 m-n位的数字:^\d{m,n}$5 零和非零开头的数字:^(0|[1-9][0-9]*)$6 非零开头的最多带两位小数的数字:^([1-9][0-9]*)+(.[0-9]{1,2})?$7 带1-2位小数的正数或负数:^(-)?\d+(.\d{1,2})?$8 正数、负数、和小数:^(-|+)?\d
2022-05-27 20:32:27
286
原创 业务中处理数据结构常用的js方法
#一、由map、filter、reduce、find展开filterfilter方法可以筛除数组和类似结构中不满足条件的元素,并返回满足条件的元素组成的数组。const integers = [1, 2, 3, 4, 6, 7];const evenIntegers = integers.filter(i => i%2 === 0);// evenIntegers的值为[2, 4, 6]findfind返回数组或类似结构中满足条件的第一个元素const pos
2022-05-27 13:47:40
359
原创 封装axios
import axios, { AxiosInstance, AxiosRequestConfig } from "axios";import { Message } from "element-ui";import { jumpLogin } from "@/utils";import { Loading } from "element-ui";import { ElLoadingComponent } from "element-ui/types/loading";// import vm f
2022-05-23 14:05:01
118
原创 vue.data页面暂存简单实现
刷新页面的时候想把当前页面的数据保存起来继续留在页面中,当我使用localstorege保存起来再放到页面中时会报错,因为$data属性是只读的,除非遍历每个属性再保存起来,但是又很麻烦,vue中data属性是个函数,于是可以这样 data() { const text = localStorage.getItem('text') const textStr = text ? JSON.stringify(text) : {} return Object.assign(
2022-05-17 11:29:48
1193
原创 如何持久化存储Vuex
使用vuex-alongvuex-along的实质也是将vuex中的数据存放到localStorage或者sessionStroage中,只不过这个存取过程组件会帮我们完成,我们只需要用vuex的读取数据方式操作就可以了,简单介绍一下vuex-along的使用方法。安装vuex-along:npm install vuex-along --save配置vuex-along: 在store/index.js中最后添加以下代码:import VueXA...
2022-05-13 23:24:11
717
原创 前后端分离之数据mock
为了做到前后端并行开发,数据mock就成为环境搭建的重要一环#1.1 Web应用前后端分离后台向前台提供API接口,只负责数据的提供和计算,而完全不处理展现 前台通过Http(Ajax)请求获取数据, 在浏览器端动态构建界面显示数据#1.2 利用Node+express提供模拟数据优点:可以在浏览器端访问 缺点:如果是打包发布就无法访问模拟数据, 只能是测试时使用修改build/dev-server.js//加载json数据var apiData = require('..
2022-05-12 23:17:10
1749
原创 js常用字符串操作
charAt()返回在指定位置的字符。var str = "abac_dfra_wa";console.log(str.charAt(3)); //输出 c#charCodeAt()返回在指定的位置的字符的 Unicode 编码。var str = "abac_dfra_wa";console.log(str.charCodeAt(3)); //输出99#fromCharCode()从字符编码创建一个字符串console.log(String.fromCharCode...
2022-05-12 23:13:43
112
原创 DOM常用API
一、基本类型介绍#1.1 Node类型DOM1级定义了一个Node接口,该接口由DOM中所有节点类型实现。这个Node接口在JS中是作为Node类型实现的。在IE9以下版本无法访问到这个类型,JS中所有节点都继承自Node类型,都共享着相同的基本属性和方法 Node有一个属性nodeType表示Node的类型,它是一个整数,其数值分别表示相应的Node类型假设我们要判断一个Node是不是元素,我们可以这样判断if(someNode.nodeType == 1){console.lo
2022-05-12 23:10:30
2497
原创 js数组对象字符串常用方法总结
#一、String对象#1.1 slicestringObject.slice(start, end)var a = 'Hello world!';var b = a.slice(2);var c = a.slice(-4, -2);// a: 'Hello world!'// b: 'llo world!'// c: 'rl',参数可为负#1.2 substrstringObject.substr(start, length)var a = 'Hello world!'
2022-05-12 23:05:25
881
原创 js常用代码片段
转义特殊字符为html实体HtmlEncode: function(str){ return str.replace(/&/g, '&').replace(/\"/g, '"').replace(/</g, '<').replace(/>/g, '>').replace(/'/g, ''');},验证是否为有效的手机电话号码IsMobile: function(str){ var rp = /^1[3|4|5|7|8][0-9]\d{4,8}$/;
2022-05-12 22:58:52
154
原创 javascript常用API集合
#一、节点1.1 节点属性Node.nodeName //返回节点名称,只读Node.nodeType //返回节点类型的常数值,只读Node.nodeValue //返回Text或Comment节点的文本值,只读Node.textContent //返回当前节点和它的所有后代节点的文本内容,可读写Node.baseURI //返回当前网页的绝对路径Node.ownerDocument //返回当前节点所在的顶层文档对象,即documentNode.nextSib
2022-05-12 20:25:02
180
原创 javascript常用积累
一、JS动画与动作不一致解决:if(!$( "#handle").is(":animated")){ //判断元素是否处于动画状态}#二、停止事件冒泡event.stopPropagation();- 禁止JS报错 window.onerror = function(){ return true ; }try {/*try to do*/} catch(e){/*do this if try error */}#三、查看JS对象属性 var res =
2022-05-11 18:33:26
130
原创 css常用的代码片段
1、垂直对齐如果你用CSS,则你会有困惑:我该怎么垂直对齐容器中的元素?现在,利用CSS3的Transform,可以很优雅的解决这个困惑:.verticalcenter{ position: relative; top: 50%; -webkit-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%);}使用这个技巧,从单行文本、
2022-05-11 14:17:50
374
原创 vue中axios封装请求
执行 GET 请求// 向具有指定ID的用户发出请求axios.get('/user?ID=12345').then(function (res) { console.log(res);}).catch(function (error) { console.log(error);}); // 也可以通过 params 对象传递参数axios.get('/user', { params: { ID: 12345 }}).then(fun
2022-05-11 13:55:21
7032
原创 git常用命令备忘录
Git配置git config --global user.name "robbin" git config --global user.email "fankai@gmail.com"git config --global color.ui truegit config --global alias.co checkoutgit config --global alias.ci commitgit config --global alias.st statusgit config -
2022-05-11 13:49:47
216
原创 lodash常用API
_.chunk将数组进行切分这个函数把数组按照一定的长度分开,返回新的数组。(片段化数组)const arr = [1,2,3,4,5,6,7,8,9];_.chunk(arr,2);// =>[[1,2],[3,4],[5,6],[7,8],[9]]#compact去除假值。(将所有的空值,0,NaN过滤掉)_.compact(['1','2',' ',0])// => ['1','2']#uniq数组去重。(将数组中的对象去重,只能是数组
2022-05-11 13:43:34
630
原创 三级标签列表实现路由跳转
做电商网站时会经常遇到这种三级标签,如果使用router-link跳转那会给每个标签都加上,非常耗性能,所以一般都是使用编程式导航和事件委托来完成路由跳转,我们可以给每个a标签打上自定义属性data-XXX,然后一级菜单和二级菜单还有三级菜单各打上鸽子的自定义属性data-xxx123<div class="all-sort-list2" @click="goSearch" @mouseleave="leaveIndex"> <div class="ite...
2022-04-25 19:25:38
527
原创 Vue一些API盲点
使用 performance 开启性能追踪performance API是Vue全局配置API中的一个,我们可以使用它来进行网页性能的追踪,我们可以在入口文件中添加if (process.env.NODE_ENV !== 'production') { Vue.config.performance = true;}来开启这一功能,该 API(2.2.0 新增)功能只适用于开发模式和支持 performance.mark API 的浏览器上,开启后我们可以下载 Vue ...
2022-04-21 16:26:41
1970
原创 DIV企业命名参考
网页内容类 标题: title 摘要: summary 箭头: arrow 商标: label 网站标志: logo 转角/圆角: corner 横幅广告: banner 子菜单: subMenu 搜索: search 搜索框: searchBox 登录: login 登录条:loginbar 工具条: toolbar 下拉: drop 标签页: tab
2022-04-21 12:31:22
106
原创 javascript100个代码片段
实现字符串长度截取function cutstr(str, len) { var temp; var icount = 0; var patrn = /[^\x00-\xff]/; var strre = ""; for (var i = 0; i < str.length; i++) { if (icount < len - 1) { temp = st
2022-04-20 17:35:51
233
原创 DOM事件总结
一.Dom事件的级别1. element.onclick = function () { }2. element.addEventListener('click', function () { }, false);【重要】上面的第三参数中,true表示事件在捕获阶段触发,false表示事件在冒泡阶段触发(默认)。如果不写,则默认为false。3. element.addEventListener('keyup', function () {
2022-04-20 17:15:37
283
原创 原型和原型链总结
说到原型就要提到对象,创建对象的三种方式方式一.字面量var obj11 = {name: 'smyh'}; var obj12 = new Object(name: `smyh`); //内置对象(内置的构造函数)两只写法效果是一样的,第一种是字面量的写法,第二种是内置的构造函数方式二.通过构造函数 var M = function (name) { this.name = name; } var obj3 = new M('smy
2022-04-20 16:58:19
117
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人