自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(49)
  • 收藏
  • 关注

转载 上传图片如何对图片进行压缩canvas

前言:哈喽,朋友们,最近一直在马不停蹄地赶项目,很久没有写博客了。今天我们来看一下前端上传图片地时候如何对图片进行压缩1、图片上传我近期写项目都是使用的VUE,这里上传图片使用了Element-ui这个组件库具体代码如下:<el-upload class="avatar-uploader" action="https://jsonplacehol...

2019-06-03 16:43:00 195

转载 socket应用(vue、node.js、M站)

socket应用(vue、node.js、M站)前言:我们在做一些项目的时候需要做到实时变化,比如我们有时候有需求会要求我们做一个类似于聊天室的页面比如有些时候我们对某些东西进行点赞和刷票,需要实时显示出来如果我们设置定时刷新内容,是一个比较不合适的事情(定时请求接口对性能会造成影响),所以我们需要socket来为我们提供实时性Node...

2019-02-28 15:01:00 139

转载 文件、图片、视频上传怎么传

文件上传怎么传前言:周五的时候有了一个新的需求,要求上传图片和视频,初次尝试的我屡屡遇坑,下面给大家分享我的心历路程(yun tou zhuan xiang)传输的内容:首先我们要确定传输的内容,如果传输的内容不对的话,我们写的再对也没有用那么传输什么样的数据应该是什么样的呢?当显示出(binary)就代表我们传输的内容是正确的了,否则不要谈别的了...

2019-02-24 16:10:00 305

转载 web前端学习python之第一章_基础语法(二)

web前端学习python之第一章_基础语法(二)前言:最近新做了一个管理系统,前端已经基本完成,但是后端人手不足没人给我写接口,自力更生丰衣足食,所以决定自学python自己给自己写接口哈哈哈哈~上一章内容:web前端学习python之第一章_基础语法(一)函数的定义和使用内置函数python有很多内置的有用的函数,可以直接调用,参考网...

2019-02-23 15:55:00 124

转载 web前端学习python之第一章_基础语法(一)

web前端学习python之第一章_基础语法(一)前言:最近新做了一个管理系统,前端已经基本完成,但是后端人手不足没人给我写接口,自力更生丰衣足食,所以决定自学python自己给自己写接口哈哈哈哈~先从hello world开始输出语法:print()新建一个文件hello.py//填写内容print("hello , wor...

2019-02-21 14:10:00 113

转载 vue+富文本编辑器UEditor

vue+富文本编辑器UEditor昨天的需求是把textarea换成富文本编辑器的形式,网上找了几种富文本编辑器ueditor、tinymce等,觉得ueditor实现双向绑定还挺有意思,分享一下~按照下面步骤即可前言vue2https://github.com/yangTwo100/vue2UEditorvue-cli3...

2019-01-16 16:21:00 310

转载 从零开始 —— Canvas(一)

从零开始-Canvas1、颜色、样式和阴影属性  a、fillStyle(设置或返回用于填充绘画的颜色、渐变或模式)    语法:context.fillStyle = color(颜色值) | gradient(渐变对象,线性或者放射性) | pattern(填充绘图的pattern对象) ;    定义一个用蓝色填充的矩形<body>...

2019-01-09 14:19:00 111

转载 前端必备之Node+mysql+ejs模版如何写接口

前端必备之Node+mysql+ejs模版如何写接口这星期公司要做一个视频的后台管理系统,让我用Node+mysql+ejs配合写接口,周末在家研究了一下,趁还没来具体需求把研究内容在这里分享一下。1、准备  准备Node环境,mysql环境,我这里用express脚手架起了一个小项目demo 2、建数据库  我这里用了可视化工具,...

2019-01-07 11:18:00 172

转载 浏览器缓存机制

浏览器缓存机制前言:每当我们第二次打开同一个网页的时候,size部分的form memory cache即为从缓存中读取,我们可以发现有很多内容都是直接从缓存中读取到的。1、浏览器缓存的优缺点优点:加快页面打开速度降低服务器压力减少网络损耗缺点:  缓存没有清理机制,这些缓存的文件会永久地保存在机器上给开发带来困...

2019-01-04 11:24:00 102

转载 前端实现数组去重,如何高效快捷?

数组去重1、双循环去重双重for(或while)循环是比较笨拙的方法,它实现的原理很简单:先定义一个包含原始数组第一个元素的数组,然后遍历原始数组,将原始数组中的每个元素与新数组中的每个元素进行比对,如果不重复则添加到新数组中,最后返回新数组;因为它的时间复杂度是O(n^2),如果数组长度很大,那么将会非常耗费内存.function unique(arr) { ...

2018-12-23 16:47:00 649

转载 ES5和ES6那些你必须知道的事儿(三)

ES5和ES6那些你必须知道的事儿ES6新增的东西一、块级作用域:关键字let,常量const  let与var的区别:    a、不会进行变量声明提升    b、变量不允许被重复定义    c、变量不允许被删除    d、在for循环中可以保留i的值    e、循环的变量只能在当前块级作用域中使用  const和var的区别:    a、常...

2018-12-16 22:35:00 175

转载 ES5和ES6那些你必须知道的事儿(二)

ES5和ES6那些你必须知道的事儿ES5新增的东西二、对象方法  1、Object.getPrototypeOf(object)    返回对象的原型function Pasta(grain, width) { this.grain = grain; this.width = width;}var spaghetti = new P...

2018-12-16 18:50:00 102

转载 ES5和ES6那些你必须知道的事儿(一)

ES5和ES6那些你必须知道的事儿ES5新增的东西一、数组方法  1、forEach   用途:遍历,循环    对于空数组不会执行回调函数//用法array.forEach( function(currentValue, index, arr), thisValue)//currentValue 必需。当...

2018-12-16 11:13:00 152

转载 call、apply、bind,你有多了解?

call、apply、bind1、相同也不同我们先从浅显的部分开始讲,这三个方法都可以改变this的指向,都可以进行传参,第一个参数都是修改this的指向call() 和 apply() 改变this指向后会立即执行函数bind() 改变this指向后不会立即执行call() 和 apply() 区别在于参数    · call() 第一个参数是修改的...

2018-12-15 21:34:00 83

转载 javascript的event loop事件循环

javascript的event loop事件循环这是今天一个朋友发给我的一个面试题,感觉还挺有意思的,写个博客以供分享先看看这个面试题目:观察下面的代码,写出输出结果console.log('0')setTimeout(function () { console.log('1');});new Promise(function...

2018-12-14 00:09:00 92

转载 vue和react全面对比(详解)

vue和react对比(详解)放两张图镇压小妖怪本文先讲共同之处,再分析区别大纲在此:  共同点:    a、都使用虚拟dom    b、提供了响应式和组件化的视图组件    c、注意力集中保持在核心库,而将其他功能如路由和全局状态管理交给相关的库。  区别:    a、优化    b、HTML&CSS...

2018-12-12 11:51:00 1930

转载 Typescript中的装饰器原理

Typescript中的装饰器原理1、小原理  因为react中的高阶组件本质上是个高阶函数的调用,  所以高阶组件的使用,我们既可以使用函数式方法调用,也可以使用装饰器。  也就是说,装饰器的本质就是一个高阶函数,  就是利用TypeScript的弱类型特性和装饰器特性,实现了一个加强版。2、以一个例子来讲 //定义一个装...

2018-12-11 21:27:00 124

转载 在react/redux中使用Immutable

在redux中使用Immutable1、什么是Immutable?  Immutable是一旦创建,就不能被更改的数据。  对Immutable对象的任何修改或添加删除操作都会返回一个新的Immutable对象。  Immutable实现的原理是:Persistent Data Structure(持久化数据结构),              也就是数据改变时(增删...

2018-12-11 20:05:00 183

转载 柯里化---一道面试题引发的小研究

柯里化1、什么是柯里化  javascript忍者中说:在一个函数中首先填充几个参数(然后再返回一个新函数)的技术称为柯里化(Currying)。  柯里化又称部分求值,字面意思就是不会立刻求值,而是到了需要的时候再去求值。  其含义是给函数分步传递参数,每次传递参数后部分应用参数,    并返回一个更具体的函数接受剩下的参数,这中间可嵌套多层这样的接受部分参数函数,...

2018-12-10 17:55:00 109

转载 vuex详解

vuex详解  yarn add vuex1、vuex流程图  vuex可以帮助我们管理组件间公共的数据  创建一个 store // 如果在模块化构建系统中,请确保在开头调用了 Vue.use(Vuex)const store = new Vuex.Store({ state: { count: 0 }, mutation...

2018-12-10 15:00:00 182

转载 vue的.vue文件是怎么run起来的(vue-loader)

vue的.vue文件是怎么run起来的(vue-loader)引子:vue的.vue文件是怎么跑起来的?   答:通过vue-loader,解析.vue文件,在webpack解析,拆解vue组件1、vue-loader做了什么?vue-loader是一个webpack加载器,这是vue组件的格式:<template> ...&...

2018-12-09 23:49:00 115

转载 重绘(Repaint)和回流(Reflow)

重绘(Repaint)和回流(Reflow)1、回流和重绘只是渲染步骤的一小节,是怎么做到影响性能的?  css 会影响 javascrip 执行时间导致 javascript 脚本变慢浏览器渲染一个网页的时候会启用两条线程:一条渲染javascript 脚本,另一条渲染 ui 即css 样式的渲染。但这两条线程是互斥的。当javascript 线程运行的时候...

2018-12-07 10:47:00 175

转载 react router @4 和 vue路由 详解(八)vue路由守卫

完整版:https://www.cnblogs.com/yangyangxxb/p/10066650.html13、vue路由守卫  a、beforeEach  全局守卫(每个路由调用前都会触发,根据from和to来判断是哪个路由触发)const router = new VueRouter({ ... })router.beforeEach((...

2018-12-06 08:38:00 179

转载 react router @4 和 vue路由 详解(七)react路由守卫

完整版:https://www.cnblogs.com/yangyangxxb/p/10066650.html12、react路由守卫?  a、在之前的版本中,React Router 也提供了类似的onEnter钩子,但在 React Router 4.0 版本中,取消了这个方法。  b、那么在react中如果我们也需要路由守卫怎么办?比如在跳转路由前需要判断用户...

2018-12-06 08:37:00 125

转载 react router @4 和 vue路由 详解(六)vue怎么通过路由传参?

完整版:https://www.cnblogs.com/yangyangxxb/p/10066650.html8、vue怎么通过路由传参?  a、通配符传参数//在定义路由的时候{ path: '/describe/:id', name: 'Describe', component: Describe}//在使用...

2018-12-06 08:36:00 62

转载 react router @4 和 vue路由 详解(五)react怎么通过路由传参

完整版:https://www.cnblogs.com/yangyangxxb/p/10066650.html7、react怎么通过路由传参?  a、通配符传参(刷新页面数据不丢失)//在定义路由的时候<Route path='/path/:自己起个名字' component={Path}/>//在路由点击跳转的时候<Li...

2018-12-06 08:34:00 85

转载 react router @4 和 vue路由 详解(四)vue如何在路由里面定义一个子路由

完整版:https://www.cnblogs.com/yangyangxxb/p/10066650.html6、vue如何在路由里面定义一个子路由?  给父路由加一个children:[]  参考我的<1.d>的代码const routes = [ {     //path是路由的路径 path:'/'...

2018-12-06 08:33:00 148

转载 react router @4 和 vue路由 详解(三)react如何在路由里面定义一个子路由

完整版:https://www.cnblogs.com/yangyangxxb/p/10066650.html5、react如何在路由里面定义一个子路由?  a、引入在需要子路由的页面引入Route标签     <Route path='/noteDetail/home' component={NodeDe} />  b、举个????(糖炒栗子,...

2018-12-06 08:31:00 118

转载 react router @4 和 vue路由 详解(二)react-router @4用法

完整版:https://www.cnblogs.com/yangyangxxb/p/10066650.html2、react-router @4用法  a、大概目录   不需要像vue那样麻烦的用到一个单独的文件夹,react只需要在index.js中部分配置即可  b、准备工作    yarn add react-rou...

2018-12-06 08:28:00 108

转载 react router @4 和 vue路由 详解(一)vue路由基础和使用

完整版:https://www.cnblogs.com/yangyangxxb/p/10066650.html1、vue路由基础和使用  a、大概目录 我这里建了一个router文件夹,文件夹下有index.html  b、准备工作:    npm install vue-router    或者 yarn add vue...

2018-12-06 08:24:00 100

转载 react router @4 和 vue路由 详解(全)

react router @4 和 vue路由本文大纲:1、vue路由基础和使用2、react-router @4用法3、什么是包容性路由?什么是排他性路由?4、react路由有两个重要的属性:children和render的区别?5、react如何在路由里面定义一个子路由?6、vue如何在路由里面定义一个子路由?7、react怎么通过路由传参?8、v...

2018-12-05 21:25:00 394

转载 redux源码解析(深度解析redux+异步demo)

redux源码解析1、首先让我们看看都有哪些内容2、让我们看看redux的流程图    Store:一个库,保存数据的地方,整个项目只有一个      创建store      Redux提供 creatStore 函数来生成 Store// 引入reduximport { createStore } from 'redu...

2018-12-01 00:02:00 113

转载 vue项目如何打包前后端不分离发布手把手教学apache、nginx

vue项目如何不分离发布1、首先yarn build  我用了vue-cli脚手架,bulid后的dist文件夹里的index.html有加版本号,那么为什么需要加版本号呢?  a、回滚  b、解决浏览器缓存的问题2、我们使用apache或者nginx帮助我们2a、apache    这里我用的是XAMPP    1>把apac...

2018-11-29 22:04:00 644

转载 for-each、for-in和for-of的区别

for-each、for-in和for-of的区别1、forEach()方法用于调用数组的每个元素,并将元素传递给回调函数。注意:forEach() 对于空数组是不会执行回调函数的。array.forEach(function(currentValue, index, arr), thisValue)参数1:function(currentValue, index, a...

2018-11-29 10:41:00 120

转载 react之传递数据的几种方式props传值、路由传值、状态提升、redux、context

react之传递数据的几种方式1、父子传值父传值:<子的标签 value={'aaa'} index={'bbb'}></子的标签>子接值:<li key={this.props.index}>{this.props.value}</li>不止可以传值也可以传递方法:父:方法={this.方法}子:{thi...

2018-11-28 23:52:00 892

转载 H5 PWA技术以及小demo

H5 PWA技术1、原生app优缺点  a、体验好、下载到手机上入口方便  b、开发成本高(ios和安卓)  c、软件上线需要审核  d、版本更新需要将新版本上传到不同的应用商店  e、使用前需下载2、web网页优缺点  a、开发成本低、网站更新时上传最新的资源到服务器即可、手机自带浏览器打开即可  b、体验比原生app差  ...

2018-11-15 17:36:00 526

转载 H5离线缓存技术Application Cache

H5离线缓存技术Application Cache1、离线缓存技术:是浏览器本身的一种机制HTML5引入Application Cache(应用程序缓存)技术,离线存储可以将站点的一些文件存储在本地,在没有网络的情况下可以访问到已缓存的对应的站点页面,这些文件包括html、js、css、img等文件;其实在有网络的时候,浏览器也会优先使用已离线存储的文件。而且做好相应资源的缓存可...

2018-11-13 16:42:00 165

转载 Mac上搭建nginx教程

1、安装Homebrewruby-e"$(curl-fsSLhttps://raw.githubusercontent.com/Homebrew/install/master/install)"期间需要输入mac密码进度条结束就OK啦2、安装nginxbrewinstallnginx3、验证结果brew services star...

2018-11-10 17:50:00 49

转载 如何搭一个vue项目

1、yarn global add @vue/cli (vue/cli是webpack的二次开发)2、vue create 自定义项目名称3、选择Manually select features4、选下列四项,Linter/Formatter代码约束力强,用习惯了以后可以选上5、yes...

2018-11-02 22:08:00 57

转载 socket.io中emit和on的用法

1、搭一个server服务器var server = require('http').createServer((req, res) => {res.end("111")});var io = require('socket.io')(server);server.listen(9002);2、在发生特定情况时发送一个action命令  a)命...

2018-11-01 21:44:00 223

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除