- 博客(45)
- 收藏
- 关注
RSS订阅原创 使用elementUI的日期时间选择控件报错"TypeError: value.getTime is not a function"
原因是：日期选择器【el-date-picker】加了格式 value-format="yyyy-MM-dd" format="yyyy-MM-dd"和校验规则：{ type: 'date', required: true, message: '请选择日期', trigger: 'change' }后，结果报错解决方法：将校验规则中的 type: 'date'，改成 type: 'St...
2019-02-22 15:26:39
5684
1
原创 ES6-数值的扩展
1、Number.parseInt(), Number.parseFloat()// ES5的写法parseInt('12.34') // 12parseFloat('123.45#') // 123.45// ES6的写法Number.parseInt('12.34') // 12Number.parseFloat('123.45#') // 123.452、指数运算符 ...
2019-01-21 19:08:59
246
转载 localStorage本地存储
做项目遇到这样一个问题：通过vue-router的<router-link :to=""></router-link>跳转链接带的参数id，保存在了vuex的store里，但页面一刷新，该id就没有了。怎么解决这一问题：将id存进localStorage参考下面这个博客：本地存储localStorage用法详解...
2019-01-21 15:12:36
197
转载 一篇文章彻底说清JS的深拷贝and浅拷贝
这篇文章的受众第一类,业务需要,急需知道如何深拷贝JS对象的开发者。 第二类,希望扎实JS基础,将来好去面试官前秀操作的好学者。https://segmentfault.com/a/1190000012828382...
2019-01-14 17:11:41
167
转载 Vue.js是如何做到数据响应的？
Vue数据响应原理https://mp.weixin.qq.com/s/1wPePhAoBtsb0XcUzFSfug
2019-01-14 15:08:45
273
转载 从 0 到 1 再到 100, 搭建、编写、构建一个前端项目
如何搭建一个前端项目https://segmentfault.com/a/1190000017158444
2019-01-14 11:01:43
310
转载 优雅使用 Element-UI 的 Loading 组件
Element-UI 提供了 Loading 组件，通过对于这个组件进行一些处理，我们能做到在发送请求的时候进行 loading 操作转载记录：https://www.jianshu.com/p/95ec2286bc6d
2018-12-13 17:51:00
1738
原创 js onerror事件
官方文档上对这个事件的解释是：onerror 事件会在文档或图像加载过程中发生错误时被触发。在装载文档或图像的过程中如果发生了错误，就会调用该事件句柄。那么它是用在什么地方，怎么用的？举个栗子：在开发中，有通过接口传来的图片，但该图片不一定能读出来（也就是报404错误）。这时如果不做处理，在Chrome下图片会不显示，在ie下会出现一个图片缺省的样子（很丑...）。测试小姐...
2018-12-13 17:48:03
1411
原创 beforeRouteEnter (to, from, next)获取前后下的路由
在某个页面文件内（如welcom.vue）用beforeRouteEnter (to, from, next)可以获取前后下的所有路由，在项目开发中经常会用到。比如用来做路由跳转控制、在路由跳转前或后调用方法等。其中遇到的一个问题是，要点击浏览器返回按钮返回上一页，但我们这个项目进入首页前还有一个动画页（也就是说，只点一次返回按钮，是到动画页，动画页自动鉴权又直接进了首页，导致看起来是没有正常...
2018-12-13 16:33:05
14345
转载 同步与异步 || async/await 和 promise 的执行顺序
通俗理解下：多个异步请求几乎是同时进行的；多个同步请求会等请求1结束后，再调请求2，以此类推...怎么让请求同步？async await参考这篇文章：ES6系列文章 异步神器async-await那么就要谈到第二个话题：async/await 和 promise 的执行顺序，请看下面文章，讲的比较清晰8 张图帮你一步步看清 async/await 和 promise 的执行...
2018-12-13 15:53:01
510
原创 错误：Cannot read property ' editIndex' of undefined
报undefined错误时，最基本的就是没有定义。而这里要提到的原因是关于this的原因：在回调函数中用的this去取值，this的指向乱掉，找不到该字段值，陷入“回调地狱”解决方法：在回调中用箭头函数，或者在函数块开头用let self = this，用self去取字段值...
2018-12-13 15:23:07
2366
原创 报错：Cannot read property 'xxx' of null
这个错误在开发时经常遇到，这里谈谈引起该问题的其中一种可能原因及解决方法，希望能帮到你。开发场景：用for循环渲染列表，列表中需要渲染某个字段值，该字段值报null错误原因：列表数据很多，没有一一查看每条数据该字段值是否都有。一旦某条数据的该字段值为空，就会报这个错误，进而整个列表不能渲染解决方法：在用for循环的html标签上加上v-if="该字段值"。意思是，如果字段值为空，就不渲...
2018-12-13 15:06:06
36060
1
原创 Vue父组件如何调用子组件的方法
对文章Vue.js 父子组件通信的十种方式做一个补充：在父子组件通信中，父组件如何调用定义在子组件的方法1、父组件文件，使用子组件时，声明ref属性：<v-header ref="header"></v-header>2、父组件函数中，用this.$refs调子组件的数据或方法：如：this.$refs.header.属性名this.$refs.hea...
2018-11-30 19:12:21
18982
3
转载 JS中this是什么
要搞清楚this到底是个什么，怎么用的，在JS中还是非常重要的（即使现在ES6能解决this带来的一部分问题），它和JS面向对象的思想有着密不可分的关系，最近看到两篇文章可以参考来学习：JavaScript 的这个难点，毁掉了多少程序员？（这篇文章是从没学过面向对象编程的读者角度切入讲this的）秒懂this（这篇文章对this作了一个汇总）...
2018-11-30 18:33:44
1018
转载 ES6 核心特性
ES6 虽提供了许多新特性，但我们实际工作中用到频率较高并不多，根据二八法则，我们应该用百分之八十的精力和时间，好好专研这百分之二十核心特性，将会收到事半功倍的奇效下面这篇文章就详细介绍了一部分核心特性，目录如下：https://mp.weixin.qq.com/s/MghF85KhDPBSdaE1GXWjQg 开发环境配置：babel 编译 ES6 语法，如何用 webpack 实...
2018-11-30 17:24:51
152
转载 网页首屏优化及骨架屏
打开应用时，有没有遇到过首屏白屏的情况？浏览器渲染页面，在等待HTML文档返回时，会处于白屏状态，用户体验不好，没有任何引导和缓冲那么，有没有看到过这种界面？看到这种界面时，用户一般认为页面正在加载，是值得等的这就是骨架屏，加强了用户体验骨架屏现在有越来越多的应用，这篇文章就是关于如何解决首屏白屏加载问题以及骨架屏实现的介绍几篇文章，按顺序看能更明白些：美团网页首屏...
2018-11-30 11:00:18
1215
转载 Vue响应式原理及实现
一直认为明白Vue的底层实现原理很重要，能给你提供高效正确的开发思路，但深挖原理也确实有难度这里推荐一篇讲Vue响应式原理的文章，希望能从中有点收获https://mp.weixin.qq.com/s/WqsmZ2UL_5ZulOct5e37DQ...
2018-11-30 10:41:25
822
1
转载 关于JS事件循环机制
早些时候因为看到一个JS面试题，在这篇文章（实例理解promise、macro-task、micro-task）中有谈到过一些事件循环机制的问题，但是因为找了多方资料整理出来的，某些概念说的还是不清楚看到下面这篇文章，对事件循环机制介绍的思路很清晰，值得存档学习https://mp.weixin.qq.com/s/9_hZX_xWSr3Gd1X_2_WOsA文章最后的答案附在下面，不过...
2018-11-30 09:31:35
140
原创 Charles抓包的在前端调试中的两个应用
【在开始之前，先甩一个链接H5移动调试全攻略，把H5的调试技巧介绍的比较全面】但今天重点是把里面的Charles抓包工具拿出来，捋一捋两个常用的Charles调试应用，特别是调试线上问题的便利之处一、调试移动端的配置Charles抓包首先需要配置手机代理，在手机上操作步骤如下：选择（电脑和手机）正在连的WiFi --> 进代理设置 --> 手动 --> 输入电脑ip和...
2018-11-29 20:26:02
463
原创 圆柱注水统计图实现
项目需要，前段时间简单研究了下怎么实现把数据用圆柱中注水的方式表现出来，设计图如下：具体需求：数据范围[0, 40]，不要求动态显示（该图会导出为pdf），根据数据的多少控制注水的高度；【如果需要动态的过渡效果，可以用CSS transition属性，把样式加在对应的div上{ position: absolute transition: height xxxpx...
2018-11-26 20:21:51
1006
原创 Part 2 代码复用（继承VS组合）
谈这个主题之前，我们先来聊聊代码复用，很多时候我们要复用一段代码时，发出的第一个呐喊就是“我要继承！”。但实际上把继承的目的定为代码复用，本身就是一个错误的理解，那继承到底是干嘛的，往下看...JS中是使用原型来模拟继承的，如：而继承的真正目的是向上转型实现多态 ，那么什么是多态，什么是向上转型？多态：把“不变的”和“可变的”分开（把“做什么”和“谁去做”分开），同一操作作...
2018-11-20 10:28:16
283
原创 Part 1 对象与原型
（先给csdn点个赞，富文本编辑器改版好用多了，我终于能用水平线啦）从对象的创建谈原型在Java中，创建对象的方法是：先用class把问题抽象出来，再用new实例化产生对象在js中，创建对象的方法当然可以用new实例化类得到（如 let obj = new Type()）；也可以用 let obj = {}的方法创建。比较熟悉Java或C++的同僚自然而然就觉得js第二种创建对...
2018-11-19 20:23:02
207
原创 移动web的适配
我在另一篇文章中谈到过一些移动端分辨率自适应问题，主要是基于个人实际开发中遇到的问题提出的解决方法。近期有幸听到他人对移动web开发的分享，特来补充上一篇文章，向大神讨教。Part 1 理解关于长度单位的一些概念1、设备像素或逻辑像素指设备能控制显示的最小物理单位，意指屏幕上一个个的点（还是不理解？？太正常了，接着往下看）2、CSS像素或设备独立像素指CSS样式代码中使用的逻辑像素...
2018-11-19 15:14:37
8577
转载 Vue高版本中一些新特性的使用
主要包括以下几点：深度作用选择器（ >>> ）我在另一篇文章中也有提到这点Vue: scoped 样式与 CSS Module 对比组件配置项inheritAttrs、组件实例属性$attrs和$listeners发生在父子组件之间组件选项 provide/inject发生在父子组件之间作用域插槽 slot-scope在组件中小细节的需求变化中很实...
2018-11-17 11:07:28
255
转载 Vue: scoped 样式与 CSS Module 对比
每个通过 vue-cli 创建的 Vue.js 应用都内置了两个很好的解决方案：Scoped CSS 和 CSS Modules (模块式 CSS)。两种方案各有优缺点，我们来看下哪种方案在你的案例中更适用。Scoped 样式我们只需要在 style 标签上添加一个 scoped 属性即可启用 scoped 样式：这样就会使得我们的样式只被应用到这个组件中的元素上。这是借助 PostC...
2018-11-17 10:56:16
912
转载 JS对象继承方式的六种写法
一、对象冒充其原理如下：构造函数使用 this 关键字给所有属性和方法赋值（即采用类声明的构造函数方式）。因为构造函数只是一个函数，所以可使 Parent 构造函数 成为 Children 的方法，然后调用它。Children 就会收到 Parent 的构造函数中定义的属性和方法。例如，用下面的方式定义 Parent 和 Children：原理：就是把 Parent 构造函数放到 Child...
2018-11-17 10:24:18
1376
转载 JavaScript正则表达式之语法--诙谐易懂
正则表达式可以用来做表单校验，也可以用来搜索关键字，匹配字符等等，功能非常强大，但是刚开始看到正则的语法就头大，什么代码，明明乱码好嘛？！但是这么好用的东西怎么能不学习，偶然看到师父转发的文章，简直让我这初学者醍醐灌顶，作者讲的很通俗易懂。在文章开始前，要了解es6字符串操作方法Regex专题：语法（也有一篇微信文章转载复述了此文，附上链接：一次性搞懂JavaScript正则表达式之语法）...
2018-11-15 20:45:57
163
转载 JavaScript 复杂判断的更优雅写法
写代码总会碰到需要复杂判断的地方，我们第一反应就是各种if else或者switch case，但是判断多的话代码会显得很臃肿，下面这篇文章用例子一步步介绍了复杂判断的优雅写法，用到es6的语法等。转载来学习https://mp.weixin.qq.com/s?__biz=MzIyMDkwODczNw==&mid=2247484253&idx=1&sn=f98199386...
2018-11-15 19:56:33
518
转载 用v-for时v-bind:key值用什么绑定比较好，key？index？或者item.id？
我们知道v-for有三个参数：value，key，index，在用v-for时需要绑定唯一的索引值，这时就要考虑三种绑定值效果是否一致？会不会有潜在的问题？用哪个比较好？看到一篇博文，用实验验证了这个问题，特转载学习，附上链接：https://www.cnblogs.com/tim100/p/7262963.html?tdsourcetag=s_pcqq_aiomsg...
2018-11-07 11:36:26
5026
转载 Vue.js 父子组件通信的十种方式
转载微信上的一篇文章1、prop这个在我们日常开发当中用到的非常多。简单来说，我们可以通过 Prop 向子组件传递数据。用一个形象的比喻来说，父子组件之间的数据传递相当于自上而下的下水管子，只能从上往下流，不能逆流。这也正是 Vue 的设计理念之单向数据流。而 Prop 正是管道与管道之间的一个衔接口，这样水（数据）才能往下流。浏览器输出2、$emit官方说法是触发当前实例上的事件...
2018-11-06 20:09:45
23346
原创 如何改变hr标签的颜色
说到颜色变化，大家首先想到的都是color,但是color一般都是针对字体颜色的，线条需要用background-color,但是单纯的将背景色设为蓝色是不够的，线条还是灰色的，我们需要给线条一个高度，也就是我们需要的1px这样设置完后，在浏览器中可以看到线条变粗了，而且原来的灰色好像还是存在的其实，hr是有默认的border的，我们需要将它的边框去掉，设为border:none...
2018-11-06 19:45:59
28508
2
转载 优雅的链式取值
整理微信上看到的文章，推荐学习在调数据接口时，都会遇到链式取值的问题，如：res.data.goods.list[0].price为了良好的处理报错（Uncaught TypeError: Cannot read property ‘goods’ of undefined），我们一般会判断取值是否为空，即if (res.data.goods.list[0] && res....
2018-11-04 10:06:00
471
转载 深入 Vue 生命周期
“微信上看到一篇文章，觉得把VUE生命周期讲的不错，特转载学习”这篇博客将会从下面四个常见的应用诠释组件的生命周期，以及各个生命周期应该干什么事1、单组件的生命周期2、父子组件的生命周期3、兄弟组件的生命周期4、宏mixin的生命周期生命周期：Vue 实例从开始创建、初始化数据、编译模板、挂载Dom→渲染、更新→渲染、卸载等一系列过程，我们称这是 Vue 的生命周期，各个阶段有相对应的...
2018-11-02 19:36:51
144
原创 字符串的扩展
1、for…of循环遍历字符串for (let codePoint of 'foo') { console.log(codePoint)}// "f"// "o"// "o"2、includes(), startsWith(), endsWith()–includes()：返回布尔值，表示是否找到了参数字符串–startsWith()：返回布尔值，表示参数字符串是否在原字符串..
2018-11-01 16:29:43
184
原创 原生单选按钮样式更改遇到的问题
首先说明，这个单选按钮样式更改用到了elementUI的样式，项目引入element的样式包后，直接在相应的标签上加element定义好的class名，具体如何改的这里不作赘述（照着源码写就可以）。重点是遇到的问题：elementUI的单选按钮在选中后会加一个class名is-checked，这个class名决定了选中的样式，如下：自然而然想到在js中给单选按钮绑定点击事件，用addClas...
2018-10-31 19:06:22
432
原创 变量的解构赋值及用途
一、数组的解构赋值1、基本用法：完全解构：let a = 1;let b = 2;let c = 3; 可以写成 let [a, b, c] = [1, 2, 3];不完全解构：等号左边的模式，只匹配一部分的等号右边的数组，解构依然成功2、默认值：解构解析允许指定默认值如：let [x, y = ‘b’] = [‘a’]; // x=‘a’, y=‘b’注...
2018-10-29 19:51:47
303
原创 实例理解promise、macro-task、micro-task
setTimeout(function(){ console.log(1);}, 0);new Promise(function executor(resolve){ console.log(2); for(var i=0; i&lt;10000; i++){ i == 999 &amp;&amp; resolve(); } console.log(3);}).then(fun...
2018-10-29 15:53:51
514
原创 let、const命令
let命令暂时性死区是什么意思？当变量赋值或引用在变量声明（let）之前，浏览器会报错，即在变量声明前都是“死区”。块级作用域内层块级作用域可以定义外层作用域的同名变量。避免在块级作用域内声明函数。如果确实需要，应该用函数表达式，而不是函数声明语句。只有在大括号内才能允许声明函数，否则会报错。const命令const一旦声明变量，必须初始化，不能二次赋值。const实际保证的是该...
2018-10-29 11:20:58
224
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人