- 博客(22)
- 收藏
- 关注
转载 一个「学渣」从零开始的Web前端自学之路
从 13 年专科毕业开始,一路跌跌撞撞走了很多弯路,做过餐厅服务员,进过工厂干过流水线,做过客服,干过电话销售可以说经历相当的“丰富”。最后的机缘巧合下,走上了前端开发之路,作为一个非计算机专业且低学历的人来说,自学编程其实不是件容易的事情,不过庆幸的是自己坚持下来了。目前工作还算不错,收入在目前所在的城市不算高,不算低,生活也还过得去,继续加油努力,也希望自己在今后更上一层。...
2019-02-17 21:00:00 643
转载 Vue一个案例引发「内容分发slot」的最全总结
今天我们继续来说说 Vue,目前一直在自学 Vue 然后也开始做一个项目实战,我一直认为在实战中去发现问题然后解决问题的学习方式是最好的,所以我在学习一些 Vue 的理论之后,就开始自己利用业余时间做了一个项目,然后通过项目中的一些案例进行总结。今天我们来说说 Vue 中的内容分发 <slot>,首先 Vue 实现了一套内容分发的 API,这套 API 是基于当前的 We...
2018-12-01 18:19:00 129
转载 Vue CLI 3.0脚手架如何在本地配置mock数据
前后端分离的开发模式已经是目前前端的主流模式,至于为什么会前后端分离的开发我们就不做过多的阐述,既然是前后端分离的模式开发肯定是离不开前端的数据模拟阶段。我们在开发的过程中,由于后台接口的没有完成或者没有稳定之前我们都是采用模拟数据的方式去进行开发项目,这样会使我们的前后端会同时的进行,提高我们的开发效率。因为最近自己在自学 Vue 也在自己撸一个项目,肯定会遇到使用数据的情况,...
2018-11-27 15:44:00 124
转载 Vue一个案例引发「动画」的使用总结
项目开发中动画有着很重要的作用,而且也是用到的地方非常多,例如:鼠标的进入离开,弹窗效果,组件的显示隐藏,列表的切换等等,可以说我们网页上的动画无处不在,也有人说了,这些东西也可以不使用动画。对,你说的没错可以不使用,但是,首先你要说服你的产品经理咱能不能简单点,不搞这么多虚的来点实际的,说完之后我估计你们俩得立马干起来,其次,在你的网页上不使用动画不够逼格啊,而且咱们的网页也不够生...
2018-11-27 15:42:00 115
转载 Vue一个案例引发的递归组件的使用
今天我们继续使用 Vue 的撸我们的实战项目,只有在实战中我们才会领悟更多,光纸上谈兵然并卵,继上篇我们的《Vue一个案例引发的动态组件与全局事件绑定总结》 之后,今天来聊一聊我们如何在项目中使用递归组件。信息的分类展示列表这次我们主要是实现一个信息的分类展示列表存在二级/三级的分类,如下如所示:看到这个很多人会想到这个实现起来很简单啊,来个嵌套循环不就完事了。对,你...
2018-11-15 21:56:00 110
转载 Vue双向绑定原理,教你一步一步实现双向绑定
当今前端天下以 Angular、React、vue 三足鼎立的局面,你不选择一个阵营基本上无法立足于前端,甚至是两个或者三个阵营都要选择,大势所趋。所以我们要时刻保持好奇心,拥抱变化,只有在不断的变化中你才能利于不败之地,保守只能等死。最近在学习 Vue,一直以来对它的双向绑定只能算了解并不深入,最近几天打算深入学习下,通过几天的学习查阅资料,算是对它的原理有所认识,所以自己动手...
2018-10-24 17:40:00 107
转载 珍藏版Chrome插件送给你们,不仅是程序员必备
大家好,消失了几天我又满血复活归来了,最近这几天太忙了一直在加班工作,这不昨天又干到凌晨一点,今天早上七点就起来了,到现在还都没有休息,现在只剩半血了,不对应该说现在只能爬着走了,但是一想到几天没有更新文章了,还是强忍着上来更新,证明我还行。以前啊,熬夜随随便便,现在随着年龄的增长真是不行了,一天都是懵的,所以说人呀趁年轻要努力提升自身的能力,提升认知,让自己有更大的竞争力,不然年龄...
2018-10-19 13:07:00 136
转载 Vue2.5笔记:Vue的实例与生命周期
理解与认识 Vue 的实例是我们学习 Vue 非常重要的一步,也是非常必须的,因为实例是它的一个起点,也是它的一个入口,只有我们创建一个 Vue 实例之后,我们才行利用它进行一些列的操作。首先 Vue 没有完全遵守 MVVM 的架构模式,但是它的设计也受到了该模式的启发,Vue 也就是在该模式中起到 VM(ViewModel) 的作用。如果有对 MVC、MVVM 模式不了解的同学可以...
2018-09-28 11:09:00 96
转载 Vue2.5笔记:如何在项目中使用和配置Vue
最开始的项目开发中,我们如果使用第三方的库我们会直接在项目中直接使用 script 元素标签引入即可。<scriptsrc="../xxx.js"></script>Vue 我们也可以这种引入的方式<divid="root">{{name}}</div><scriptsrc="./dist/vue.js">&l...
2018-09-25 22:34:00 83
转载 Javascript数组系列五之增删改和强大的 splice()
今天是我们介绍数组系列文章的第五篇,也是我们数组系列的最后一篇文章,只是数据系列的结束,所以大家不用担心,我们会持续的更新干货文章。生命不息,更新不止!今天我们就不那么多废话了,直接干货开始。我们在《Javascript数组系列一之栈与队列》中描述我们是如何利用 push、pop、shift、unshift方法进行数组单个元素的添加与删除。但是光有单个元素的删除恐怕难以满...
2018-09-18 09:58:00 108
转载 Javascript数组系列四之数组的转换与排序Sort方法
今天我们继续来介绍 Javascirpt 数组中的方法,也是数组系列的第四篇文章,因为数组的方法众多,每篇文章我们都对数组的每个方法都有比较细致的描述,只要你能够从中成长一点点,那我们的目的就达到了,学习是一个持续的,渐进的过程。每天进步一点点,最终会有大成就。直接进入主题数组的转换我们在项目的开发过程中,数据类型之间的转换有着非常重要的作用,而数组转换成其他数据类型是我们常...
2018-09-15 11:54:00 101
转载 Javascript数组系列三之迭代方法2
今天我们来继续 Javascript 数组系列的文章,上文 《Javascript数组系列二之迭代方法1》 我们说到一些数组的迭代方法,我们在开发项目实战的过程中熟练的使用可以大大提高我们的开发效率以及数据的处理。接下来我们继续来讲解其他的一些迭代的方法。天也黑了,时间也不早了,话不多说,撸起袖子干起来!数组的迭代方法reduce该方法对一个累加值和数组中的每一个元素执行...
2018-09-12 22:38:00 96
转载 Javascript数组系列二之迭代方法1
我们在《Javascript数组系列一之栈与队列 》中介绍了一些数组的用法。比如:数组如何表现的和「栈」一样,用什么方法表现的和「队列」一样等等一些方法,因为 Javascript 中的数组方法众多,所以我们没有在一篇文章中介绍过多的东西,接下来我们就来了解数组的其他功能吧正式开始!数组的迭代方法数组的迭代方法是我们在开发项目中使用频率非常高、非常重要、非常高效,不仅如此这些...
2018-09-10 23:10:00 92
转载 Javascript数组系列一之栈与队列
所谓数组(英语:Array),是有序的元素序列。 若将有限个类型相同的变量的集合命名,那么这个名称为数组名。 组成数组的各个变量称为数组的分量,也称为数组的元素,有时也称为下标变量。 ---百度百科简单理解,数组就是数据的有序列表。Array 在 Javascript 中属于最常用的数据类型之一了,与其它语言一样 Javascript 中的数组也是数据的有序列表,但是与其他语言有...
2018-09-10 23:08:00 85
转载 JavaScript中的正则表达式
Javascript的正则表达式是前端中比较重要的部分,正则表达式主要用于字符串处理,表单验证等场合,实用高效,文章主要对JavaScript中的正则的学习与总结正则表达式的定义正则表达式:是一个描述字符模式的对象,JavaScrip中正则表达式用RegExp对象表示,可以使用RegExp构造函数来创建正则对象正则表达式的创建1.字面量创建var ...
2017-10-18 16:16:00 124
转载 CSS布局---居中方法
在web页面布局中居中是我们常遇到的情况,而居中分为水平居中与垂直居中文本的居中CSS中对文本的居中做的非常友好,我们是需要text-align, line-height 两个属性就可以控制文本的水平以及垂直居中<head> <style type="text/css"> .text { ...
2017-08-18 14:44:00 95
转载 canvas学习总结六:绘制矩形
在第三章中(canvas学习总结三:绘制路径-线段)我们提高Canvas绘图环境中有些属于立即绘制图形方法,有些绘图方法是基于路径的。立即绘制图形方法仅有两个strokeRect(),fillRect(),两个方法都是用来绘制矩形的。Canvas的API提供了如下三个方法,分别用于矩形的清除,描边与填充clearRect(x, y, w, h): 清除指定区域,使其为全透...
2017-07-31 15:45:00 202
转载 canvas学习总结五:线段的端点与连接点
我们在第三节中描述了线段的绘制,其中线段的属性lineWidth是用来改变线段的宽度。让我们来回忆下线宽的用法function drawLine(){ cxt.lineWidth = 3; cxt.moveTo(10, 10); cxt.lineTo(120, 100); cxt.stroke();}上面的代码我们就可以绘制一条...
2017-07-04 08:42:00 409
转载 canvas学习总结四:绘制虚线
上一章节我们说到,线性路径的绘制,主要利用movoTo(),lineTo()等方法,当然 Canvas 2D API 也提供了虚线的绘制方法,CanvasRenderingContext2D.setLineDash();下面我们就来看看虚线的绘制方法语法ctx.setLineDash(segments);参数 segments:一个Array数组。一...
2017-06-21 19:48:00 555
转载 canvas学习总结三:绘制路径-线段
Canvas绘图环境中有些属于立即绘制图形方法,有些绘图方法是基于路径的。立即绘制图形方法仅有两个strokeRect(),fillRect(),虽然strokezText(),fillText()方法也是立即绘制的,但是文本不算是图形。基于路径的绘制系统 大多数绘制系统,如:SVG(Scalable Verctor Graphics, 可缩放的矢量图形),Adobe Illus...
2017-06-18 21:09:00 368
转载 Canvas学习系列二:Canvas的坐标系统
上一章内容中我们对canvas元素有了一个初步的认识,在接下来的章节中我们会慢慢学习canvas中图形的绘制;但是在绘制之前我们先来看看canvas中的坐标系统,因为这样我们才能知道绘制的图形放在什么位置。比如:我们要在canvas画布的(100,100)这个位置绘制一个圆看到这个要求顿时就懵逼了,(100, 100)在什么地方!!!至于为什么会懵逼呢?是因为我...
2017-06-13 10:49:00 2572
转载 Canvas学习系列一:初识canvas
最近你开始在学习canvas,打算把学习canvas的整个学习过程当中的一些笔记与总结记录下来,如有什么不足之处还请大神们多多指出。1. canvas介绍Canvas元素的出现,可以说开启的Web世界绘制动画,图形的大门,其功能非常强大canvas 元素是HTML5中功能最强大的元素,它的能力主要是通过Canvas中的Context(绘图上下文/绘图环境)对象表现出来的。该...
2017-06-12 09:19:00 172
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人