- 博客(38)
- 收藏
- 关注
RSS订阅原创 Uncaught (in promise) TypeError: Cannot read property ‘catch‘ of undefined
说一个很奇怪的问题，就是大家应该都会碰到的vue-router@3.0.x 以上的版本的重复点击路由的报错。// 解决ElementUI导航栏中的vue-router在3.0版本以上重复点菜单报错问题 const originalPush = VueRouter.prototype.push VueRouter.prototype.push = function push (location) { return originalPush.call(this, location).catch(er
2021-06-25 12:34:23
624
1
原创 后台管理系统中的常用正则（持续更新）（截止2021.3 最新手机号正则）
邮箱正则pattern: /^([a-zA-Z0-9]+[||-|.]?)[a-zA-Z0-9]+@([a-zA-Z0-9]+[||.]?)[a-zA-Z0-9]+.[a-zA-Z]{2,3}$/,手机号正则现有手机号码段有:* 三大运营商最新号段 合作版 2021-03 * 移动号段： * 134 135 136 137 138 139 147 148 150 151 152 157 158 159 172 178 182 183 184 187 188 195 198 * 联通号段：
2021-06-21 12:19:48
267
原创 解决NavigationDuplicated: Avoided redundant navigation to current location: 问题
vue项目中，点击左侧菜单栏中的项，重复点击时会报错，解决这个问题，首先找到项目中管理路由的文件，一般是router/index.js,有的直接就是router.js。解决代码：import Router from 'vue-router';Vue.use(Router);// 解决ElementUI导航栏中的vue-router在3.0版本以上重复点菜单报错问题const originalPush = Router.prototype.pushRouter.prototype.push = f.
2021-06-16 23:12:27
1555
4
原创 js Date对象总结
Date在js中和Array类似，都是拥有自己的特殊方法的特殊对象。由于平常用到Date着实不多，对它的了解颇浅。面试中还是会被问到的。现在既然想起来了，也学习总结一下好了。1.Date get和set系列(注：getTime()具体的参照时间为1970年1月1日8点0分0秒) 中国是东八区，所以得加上8小时所有的set对应都有get系列，详情参照 w3c文档值得注意的是所有的get和...
2020-03-02 16:04:49
365
原创 自定义 border（dashed）虚线的间距
前些日子接到一个小需求（见下图）我看了一眼，想了几秒钟，这玩意不就是 border-bottom：dashed 嘛，然后我就咔咔咔上代码，就变成下面这样了。敲完后我就感觉自己有很蠢，肯定不是这样实现的。然后我就想了一下，因为右边的按钮是需要用到渐变的，恰巧左边的下划线也能用渐变实现。东西想通之后那就也是咔咔咔几下的事情了。 .one { width: 300px...
2019-10-08 14:51:57
13615
3
原创 如何使用swiper 来做出导航栏与轮播图双控制
效果图如下以 swiper 3.x.x 版本为例1. swiper 控制 tab 栏// 这里是一个初始化的swiper 当swiper 切换结束后 调用 onSlideChangeEnd 的方法，然后来更改 tab 栏的 高亮var swiper = new Swiper('.fg-swiper', { nextButton: '.fg-next', prevB...
2019-09-20 11:14:02
1343
原创 a 标签 点击跳转到对应的位置
<div id="aaa"> <p>锚点定位的id和我不一样</p> </div> <div id="bbb"> <p>锚点定位的id和我一样，所以会跳到我这</p> </div> <a href="#bbb">点我跳到对应的锚点</a>实现原理 ...
2019-09-02 12:05:05
838
原创 jQuery 实现返回顶部滑动效果
设计思路：1、添加滚动事件2、获取当前窗口滚动高度，判断是否达到了指定高度以上3、若大于，表明用户下滚，图标显示；若小于，表明用户上滚，图标隐藏4、为图标添加点击事件，使用animate动画效果设置滚动高度调回0时所需的时间。$(document).ready(function(){ //为当前窗口添加滚动条滚动事件（适用于所有可滚动的元素和 window...
2019-07-09 11:27:15
270
原创 js—点击按钮页面滚动到顶部，底部，指定位置
之所以笔记一下这个，因为我在项目中经常用到。//页面滚动至顶部$('.scroll_top').click(function(){$('html,body').animate({scrollTop: '0px'}, 800);}); //页面滚动至指定的位置$('.scroll_a').click(function(){$('html,body').animate({scrollTo...
2019-07-06 14:56:11
3618
6
原创 vue --- 监听watch
监听 watch说明 : Vue 中可以通过 watch 配置项,来监听 vue 实例中数据的变化基本使用watch: { // 监听name属性的数据变化 // 作用 : 只要name的值发生变化,这个方法就会被调用 // 第一个参数 : 新值 // 第二个参数 : 旧值,之前的前 name(newVal,oldVal){ cons...
2019-04-11 19:49:59
243
原创 vue --- 导航守卫
需求: 如果你没有登录过, 不允许你访问其他页面解析:router.beforeEach( ( to,from,next ) => {to : 要跳转的目标对象form: 从哪里跳转过来的next: 函数next() : 放你走next( false ) : 不放你走next( ’ / ’ ) ==> 跳转 指定要跳转的路径} )解决办法:判断访问...
2019-04-11 16:15:22
113
原创 Vue学习笔记 8.0 --- 详解如何搭建vue脚手架
前言 : vue 是 单文件组件导 : 之前注册组件有什么缺点 ? 1- 缺乏语法高亮 2-格式不好整体 3-没有专门的写css代码等等参考 : vue => 工具 => 单文件组件什么是单文件组件 ? 后缀为 .vue 的文件单文件组件的三个组成部分 (代码块 : scaffold 自动提示)template (模板结构)script 组件的代码逻辑st...
2019-04-01 01:34:16
367
原创 ES6的模块语法 (基于webpack基类演示)
1. export default 默认导出一个模块 ( 简单类型 + 复杂类型 ) => export default 和 import导出 : export default默认 只能导出一个let str = 'abc'let num = 20;let obj = { name :'zs' }export default num// export defa...
2019-04-01 01:15:58
147
原创 webpack 的介绍与配置使用 (部分)
Webpackwebpack官网webpack中文网一 : Webpack 介绍Webpack 是什么?? (面试)前端模块化打包(构建)工具WebPack可以看做是模块打包机：它做的事情是，分析你的项目结构，找到JavaScript模块、其它的一些浏览器不能直接运行的拓展语言（Scss，less等）以及新语法，并将其转换和打包为合适的格式供浏览器使用。为什要使用WebPac...
2019-03-29 00:46:39
125
原创 Vue 学习笔记 7.0 --- 单页面应用 + 路由
单页面应用程序SPA : Single Page ApplicationMPA : Multiple Page Application 多页面应用程序单页web应用, 就是只有一个web页面的应用, 是加载单个HTML页面, 并在用户与应用程序交互时动态更新该页面的web应用程序区别对于传统的多页面应用程序来说, 每次请求服务器返回的都是一个完整的页面对于单页应...
2019-03-28 11:04:36
399
原创 Vue 学习笔记 6.0 --- 组件 component
组件一 : 组件化开发概念 :将一个完整的页面,抽离成一个个独立的组件,最终,通过这一个个独立组件完成整个的页面(项目)的功能组件化开发的优势/作用 : 复用官网 : 组件是可复用的 Vue 实例二 : 组件的基本使用Vue 中的两种注册组件的方法 1.全局注册 2.局部注册全局组件在所有的vue实例中都可以使用局部组件在所有的当前实例中可以使用注册全局组件 - ...
2019-03-27 10:18:56
321
原创 Vue 学习笔记 5.0 --- json-server和axios
一 : json-server 提供假数据接口json-server 作用 : 根据指定的 JSON 文件, 提供假数据接口地址 : json-server使用步骤1. 全局安装 json-server : `npm i -g json-server`2. 准备一个json数据3. 执行 : `json-server 文件路径`> json数据参考json数据...
2019-03-24 22:13:17
361
原创 Vue 学习笔记 4.0 --- 生命周期函数
生命周期函数个人认为在学习生命周期的时候,还是看图学习是最有效的,当然理论也得跟上, 本文的底部有我对周期图的中文注解所有的 vue 组件,都是 vue 实例, 一个组件对应一个实例,并且接收相同的选项对象(一些根实例特有的选项除外)实例生命周期也叫做 : 组件生命周期生命周期介绍vue 生命周期钩子函数简单说 : 一个组件(实例) 从开始到最后消灭所经历的各种状态,就是一个组件...
2019-03-24 00:17:55
389
原创 Vue 学习笔记 --- 过滤器
过滤器概念 :vue 中的过滤器(filter) : 数据格式化 ,也就是说,让数据按照我们规定的一种格式输出比如 : 对于日期来说,将日期格式化转化为 年-月-日 小时:分:秒 格式的过程 // 直接显示 <h1>{{ date }}</h1> 显示 : 2019-01-11T10:11:19.566Z 不是我们想要的 我们想要的 : 20...
2019-03-22 16:51:48
258
原创 Vue 学习笔记 3.0 --- 零散知识点
一 : 数据响应(数据劫持)凡是在data 里声明的属性,都会正常的进行数据响应(数据劫持)如果手动的添加一个属性并且赋值,无法进行正常的数据响应解决方法: this.$set(this.obj, ’ 属性名 ’ , ’ 属性值 ')以后先在data里声明数据,并且最好给一个初始值,再去做其他使用二 : key说明 :Vue 中推荐, 在使用 v-for 的时候,添加...
2019-03-22 01:46:50
365
原创 Vue 学习笔记 2.0 --- TodoMVC(demo)实操
第一步 : 下载 模板 显示样式下载模板 : git clone https://github.com/tastejs/todomvc-app-template.gitnpm i打开 index.html第二步 : 安装 vue + 配置安装 vue npm i vue引入 vue<!-- 在 app.js 引入的上面引入 vue , 因为在app.js里 要使用vue...
2019-03-21 01:41:09
370
原创 Vue 学习笔记 1.0 --- 基本概念 && 常用指令
一 : Vue 介绍vue 中文网github 下载地址Vue.js (读音 /vju:/ view)渐进式 JavaScript 框架3.1 渐进式 :小型项目 就可以使用 vue 就高度了随着页面的复杂程序提高,就要学习 vue-rouer 来管理更多的页面再随着项目的数据越来越多,管理数据也变得麻烦起来了,就开始使用 vuex 来管理数据3.2 框架 : 一整套的...
2019-03-19 22:54:36
190
原创 Node.js 知识点补充 --- 模拟后台返回数据(跨域问题)
node.js 的学习中 遇到的跨域问题原本是想放在 7.0 版本中的, 但是前者 内容太多. 怕自己找不到. 就单写一个博客方便自己查找掌握了之前学的知识后, 我自己模拟了一下 利用 express 从后台提取数据的 小demo后台代码如下 自己模拟写了一个简单的接口供前台提取//1. 引入expressconst express = require('express');/...
2019-03-18 14:40:03
274
原创 Node.js阶段学习笔记 7.0 --- mongodb的认识 && mongodb 实操
MongoDB一、MongoDB 介绍:MongoDB是一个跨平台，面向文档的数据库，高性能，高可用性和易于扩展。二、三个概念数据库:数据库是一个集合的物理容器,一个单一的MongoDB服务器通常有多个数据库。集合:集合是一组MongoDB的文件。简单理解就是一个数组 (集合里面存放 json 对象 collection(‘one’);文档 : 文档是一组键值对。[看图] ...
2019-03-18 12:06:31
299
原创 JavaScript基础 --- 内置对象
内置对象JS内置对象就是指Javascript自带的一些对象，供开发者使用，这些对象提供了一些常用的的功能。常见的内置对象有Math、String、Array、Date等内置对象有很多，主要是记下这些内置对象的用法即可。如果忘了某个方法该如何使用的时候，可以通过以下方式查看。火狐开发者网站MDNW3School网站Math对象Math对象中封装很多与数学相关的属性和方法。...
2019-03-17 10:58:41
280
原创 JavaScript基础 --- 对象的认识
对象对象的基本概念什么是对象??现实生活中 : 万物皆对象, 对象是一个具体的事物 , 一个具体的事物就会有 特征 和 行为 ;JavaScript中: js中的对象就是生活中对象的一个抽象, 没有特征和行为,取而代之的是有对应的属性和方法 ;思考 :1. 学生对象: // 特征 : 名字,性别,身高,体重 // 行为 : 吃饭、睡觉、敲代码2. js的对象 ...
2019-03-17 10:22:11
244
原创 JavaScript基础 --- 函数的认识
函数为什么要有函数?在写代码的时候，有一些常用的代码需要书写多次，如果直接复制粘贴的话，会造成大量的冗余代码。如果修改呢?? 多个页面呢??函数可以封装一段重复的JavaScript代码，它只需要声明一次，就可以被多次调用。重复代码、冗余代码的缺点：代码重复，可阅读性差不易维护，如果代码逻辑改变了，所有地方的代码都要跟着改变，效率太低。使用场景 : 只要js出现的地方都...
2019-03-17 10:01:38
199
原创 JavaScript基础 --- 数组的认识
数组所谓数组， 就是将多个元素 （通常是同一类型），按一定顺序排列放到一个集合中 ， 那么这个多个元素的集合我们就称之为数组思考 :// 为什么要有数组?//1. 我们知道,,一个变量能够存储一个值, 当我们想要存储多个值的时候, 就可以使用数组。比如存储一个班级里面所有学生的名字;//2. 使用数组可以对多个相同类型的值统一的管理,,存储起来方便,,操作的时候,也会很方便;...
2019-03-17 09:29:33
267
原创 JavaScript基础 --- 分支语句
流程控制 (超级重要)为什么要学习流程控制实际项目中, 不可能都是简单的顺序结构(从上往下执行), 会出现不同的条件, 就要根据条件不同做出相应的处理程序的三种基本结构顺序结构从上到下执行的代码就是顺序结构程序默认就是从上到下,一行一行的顺序执行的console.log("哈哈1");console.log("哈哈2");console.log("哈哈3")...
2019-03-17 09:22:56
495
原创 JavaScript基础 --- 类型转换
类型转换一、为什么要进行类型转换???服务器拿回来的数据,有可能是字符串,比如age='18', var age = '18'; console.log(age+1);二、查看变量的类型typeof关键字可以查看数据的类型var num = 11;console.log(typeof num);num = "abc";console.log(typeof num);小技...
2019-03-17 09:17:03
131
原创 JavaScript基础 --- 数据类型
数据类型为什么要学?因为值可以是一个数字 ( 100 ),也可以是一个名字(小马哥),等等,为了更多的分类,我们要学习数据类型,这样就可以轻松的处理不同的数据了javascript中数据类型分为简单数据类型和复杂数据类型，下面是简单数据类型 ( 5个 )number、string、boolean、undefined、null数值 字符串 布尔 ...
2019-03-17 09:07:01
217
原创 Node.js阶段学习笔记 6.0 --- Express 框架
Expressjs => jquerynodejs => expreessExpress 框架基于 Node.js 平台，快速、开放、极简的 web 开发框架express 官网express 中文网起步安装：npm i express// 导入 expressvar express = require('express')// 创建 e...
2019-03-17 00:49:57
268
原创 Node.js阶段学习笔记 5.0 --- 模块化思想
模块化模块化规范分类：浏览器端：AMD: requireJS require() defineCMD: seajs服务器端 (nodejs)commonJS: require exportsES6标准模块化规范 (vue里讲)import export会熟练使用模块化规范ADM(浏览器端) 、commonJS(服务器端) 、import(E...
2019-03-17 00:38:10
245
原创 Node.js阶段学习笔记 4.0 --- 实战训练(hackerNews)
NodeJS 4.0hackerNews介绍Hacker News 示例路由路由（route）：就是一套映射规则，根据url地址分配到对应的处理程序art-template 模板引擎文档安装npm install art-template核心方法// 引入template// 基于模板路径渲染模板//参数1：文件的路径//参数2：数据//返回值：返回渲染...
2019-03-17 00:32:18
592
原创 Node.js阶段学习笔记 3.0
npm - Node包管理工具这个特别特别重要,node啥也学不会,这个也得会死了都要会npm的基本概念node package managernpm官网npm中文文档1. npm 是node的包管理工具，2. 它是世界上最大的软件注册表，每星期大约有 30 亿次的下载量，包含超过 600000 个 包（package） （即，代码模块）。3. 来自各大洲的开源软件开发者...
2019-03-16 23:57:31
238
原创 Node.js阶段学习笔记 2.0
global模块-全局变量JavaScript 中有一个特殊的对象，称为全局对象（Global Object），它及其所有属性都可以在程序的任何地方访问，即全局变量。在浏览器 JavaScript 中，通常 window 是全局对象， 而 Node.js 中的全局对象是 global，所有全局变量（除了 global 本身以外）都是 global 对象的属性。在 Node.js 我们可以直接...
2019-03-16 23:49:07
193
原创 Node.js 阶段学习笔记 1.0
课程安排nodejs基础知识，核心模块包管理器npm (死了都要会)nodejs的模块化 (掌握)nodejs的框架 -express数据库-mongodb使用nodejs开发一个服务端的项目（hackerNews）ES6(部分语法) (死了都要会)nodejs 基本介绍node.js 是什么？node.js，也叫作node，或者nodejs，指的都是一个东西。nod...
2019-03-16 23:25:38
387
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人