- 博客(76)
- 资源 (3)
- 收藏
- 关注
RSS订阅原创 git 相关使用总结
简介git是Linux之父Linus开发出来的用于分布式版本控制的系统软件, 我们项目就式用git来做版本管理的。基本原理git流程图Workspace：工作区 Index / Stage：暂存区 Repository：仓库区（或本地仓库） Remote：远程仓库分支管理master：线上分支 预发环境测试通过后，运营/测试会将此分支代码发布到线上环境； develop：开发分支 开发人员每天都需要拉取/提交的最新代码分支 release：测试分支/预发...
2020-06-19 20:43:48
504
原创 Ant-Design-Pro中Table组件使用总结
一、基本使用一个Table表格主要由表头和表格内容（即数据）组成，所以最基本的Table就是由column、dataSource这两个属性组成。const dataSource = [{ key: '1', name: '胡彦斌', age: 32, address: '西湖区湖底公园1号'}, { key: '2', name: '胡彦祖', age: 4...
2019-04-25 00:30:47
16147
原创 React动态添加类名className和样式style
一、React动态添加类名已知变量：value = { class: 'class1', class2: 'class2', value: '你好' }，想得到结果如下：<div class="class1 class2">你好</div> 实现方式如下：// React实现 双类名/多类名// 常用// （字符串写法）<d...
2019-04-24 20:11:33
23665
原创 Ajax的简单封装
简单封装AjaxSimple.js// submitAjax(post方式提交)function submitAjax(form, callbak, success, cache, alone) { var cache = cache || true; var form = $(form); var url = form.attr('action'); va...
2019-01-06 17:38:23
710
原创 ant-design-pro中使用a标签的download属性下载excel文件问题
问题：情景再现：最近在用ant-design-pro做项目中，有用到a标签去下载excel文件，在谷歌，IE10等浏览器下都支持下载。但是firefox就是不支持。简述：在ant-design-pro中，火狐浏览器不支持a标签的download属性去下载文件。原因：查资料发现是因为火狐浏览器的同源策略影响。解决方案：可以考虑用link标签。拓展：在浏览器中，<...
2019-01-06 17:11:42
4808
原创 前端学习文档分享
一.react ，redux ，Ant Design 1.http://www.ruanyifeng.com/blog/2015/03/react.html2.http://cn.redux.js.org/index.html3.https://ant.design/docs/react/introduce-cn 4.http://blog.csdn.net/ElinaVampire/ar...
2019-01-02 02:00:59
683
原创 react父子组件之间的传值
父传子-------------父组件constructor(props){ super(props) this.state={ message:"我是父组件传来的" }}render(){ return( <div style={{background:"red",padding:"30px"}}> ...
2019-01-02 01:55:32
621
原创 git常用命令及常见问题笔记
常用命令： git remote -v 查看远程库git branch 查看本地库git branch FIrstSetp 创建分支git checkout FIrstSetp 切换分支git fetch origin FIrstSetp:temp 拉取远程库分支不合并，创建本地分支tempgit diff temp 比较本地分支和拉取下...
2019-01-02 01:42:09
209
原创 项目工程化
本文主要讲使用方法，以ant-design为例，首先是安装脚手架，创建项目，然后初始化，有的需要安装依赖，之后启动项目，最后构建部署。一般命令：npm install xxx -g 安装xxx依赖包 npm install 安装依赖包 npm start 启动项目npm run build 项目打...
2019-01-02 01:32:23
673
原创 AntDesignPro开发实例
拿到AntDesignPro项目，安装依赖，启动项目，基本上就可以根据你的业务需求进行开发了。首先，你需要去写一个路由页面（新建路由页面，包括js和less文件）其中，js文件中connect连接的是model文件，可以将从后台拿到的数据存在model里面，通过这个连接拿到；也可以通过这个连接发起异步请求到model。既然提到model，下面就配置一下数据模型文件model...
2019-01-02 01:03:10
6778
原创 初识ant-design-pro2.0
Ant Design 官方称： “在中台产品的研发过程中，会出现不同的设计规范和实现方式，但其中往往存在很多类似的页面和组件，给设计师和工程师带来很多困扰和重复建设，大大降低了产品的研发效率。” 因为数据交互非常频繁，大量的表单、时间选择器、表格、单选多选框，以及各种标识状态的组件，如果光靠手写或者使用 jQuery 插件，其开发的工作量仍然是相当大的，因此，An...
2019-01-02 00:35:11
1048
转载 vue-router的使用及实现原理
前端路由是直接找到与地址匹配的一个组件或对象并将其渲染出来。改变浏览器地址而不向服务器发出请求有两种方式: 1. 在地址中加入#以欺骗浏览器，地址的改变是由于正在进行页内导航 2. 使用H5的window.history功能，使用URL的Hash来模拟一个完整的URL。当打包构建应用时，Javascript 包会变得非常大，影响页面加载。如果我们能把不同路由对应的组件分割成不同的代码块，...
2018-09-28 17:51:16
2616
原创 ES6与ES5区别
ES6与ES5相比，新增了很多东西,如：一、新增箭头函数箭头函数解决的问题简化了写法。箭头函数适用于函数体只有一行的情况；当有多行时，可用普通函数增加可读性。 少打代码，结构清晰 明确了this。传统JS的this是在运行的时候确定的，而不是在定义的时候确定的；而箭头函数的this是在定义时就确定的，不能被改变，也不能被call,apply,bind这些方法修改。 明确运...
2018-09-28 17:14:24
7585
原创 JS常见笔试题
1.数组去重function oSort(arr){ var result ={}; var newArr=[]; for(vari=0;i<arr.length;i++){ if(!result[arr]){ newArr.push(arr) result[arr]=1 ...
2018-09-25 22:39:29
669
原创 css常见问题
1.清除浮动的几种方式，各自的优缺点？使用空标签清除浮动 clear:both（理论上能清除任何标签，但增加无意义的标签） 使用overflow:auto（空标签元素清除浮动而不得不增加无意代码的弊端,,使用zoom:1用于兼容IE） 用afert伪元素清除浮动(用于非IE浏览器)2.使元素居中的方法position：absolute；top:50%;left:50%; margin...
2018-09-25 22:28:40
140
原创 闭包
概念：闭包指可以包含自由（未绑定到特定对象）变量的代码块；这些变量不是在这个代码块内或者任何全局上下文中定义的，而是在定义代码块的环境中定义（局部变量）。特性：闭包是能读取其他函数内部变量的函数，即在外面可调用函数中的函数的变量，其实它是将函数内外部连接起来的桥梁。闭包一些经典题改变箭头函数的this指向，让对象里面的函数一直指向自己var b=100;var a={b:10...
2018-09-25 20:16:47
146
转载 什么是CDN加速
CND概况CDN的全称是Content Delivery Network，即内容分发网络。CND加速主要是加速静态资源，如网站上面上传的图片、媒体，以及引入的一些Js、css等文件。CND加速需要依靠各个网络节点，例如100台CDN服务器分布在全国范围，从上海访问，会从最近的节点返回资源，这是核心。CND服务器通过缓存或者主动抓取主服务器的内容来实现资源储备。关于...
2018-09-25 19:50:00
301
原创 关于vue的常见面试题
1.谈谈你对vue的认识vue概念：是一个构建用户界面的渐进式框架，典型的MVVM框架。注：模型（Model）只是普通的JavaScript对象，修改它则视图（View）会自动更新。这种设计让状态管理变得非常简单而直观。vue作用：响应式的数据绑定和组合的视图组件vue原理：数据双向绑定 模板编译和虚拟domVue实现数据双向绑定的效果，需要三大模块：Observe...
2018-09-22 14:28:07
10502
原创 对ajax、axios、fetch的认识
前端请求数据主要有XMLHttpRequest（XHR）、ajax、axios、fetch等方式。原生xhr请求var xhr = new XMLHttpRequest();xhr.open('GET', url);xhr.responseType = 'json';xhr.onload = function() { console.log(xhr.response);};...
2018-09-19 22:41:22
945
1
原创 promise常见场景
1.promise是什么Promise 是异步编程的一种解决方案。从语法上讲，promise是一个对象，它可以获取异步操作的消息；从本意上讲，它是承诺，承诺它过一段时间会给你一个结果。promise代表一个异步操作的执行返回状态，这个执行返回状态在promise对象创建时未必已知。它允许你为异步操作的成功或失败指定处理方法。2.promise解决的问题回调地狱，代码难以维护， 常常第一...
2018-09-18 21:38:23
2739
原创 谈谈性能优化问题
代码层面：避免使用CSS表达式，避免使用CSS Filter，避免使用高级选择器，通配选择器。缓存利用：缓存Ajax，使用CDN，使用外部js和css文件以便缓存，添加Expires头，服务端配置Etag，减少DNS查找等请求数量：合并样式和脚本，使用css图片精灵，初始首屏之外的图片资源按需加载，静态资源延迟加载。请求带宽：压缩文件，开启GZIP，代码层面的优化 用hash...
2018-09-18 15:58:00
1305
原创 处理过的兼容问题总结
见过一个优秀的回答：产品要实现A，设计说应该C，而我出了一个方案B，兼容了AC，这是我处理过最复杂的兼容性问题，它非常困难极具挑战，贯彻我整个前端生涯。总的来说，前端处理兼容也就是这，具体的有以下几个方面：1.html兼容问题双边距 BUG float 引起的 使用 display 3 像素问题 使用 float 引起的 使用 dislpay:inline -3px 超链接 hover...
2018-09-18 15:33:09
590
原创 call和apply的区别
call()和apply()这两个方法最基本的作用就是：改变对象的执行上下文，即this的指向。两者的异同相同点：都能够改变方法的执行上下文（执行环境），将一个对象的方法交给另一个对象来执行，并且是立即执行。不同点：传参不同，call的参数是单个的值，apply参数是数组call方法从第二个参数开始可以接收任意个参数，每个参数会映射到相应位置的func的参数上，可以通过参数名调用，...
2018-09-18 13:28:08
389
原创 Web App、Hybrid App、 Native App之间的差异
APP，一般认为是 mobile application，也就是移动移动应用程序。目前主流应用程序大体分为三类：Web App、Hybrid App、 Native App。1.Web AppWeb App 指采用Html5语言写出的App，不需要下载安装。类似于现在所说的轻应用，生存在浏览器中的应用，基本上可以说是触屏版的网页应用。WebApp是基于Web的系统和应用，其作用是向...
2018-09-17 21:18:23
11365
原创 js改变透明度实现轮播
在项目中常见的就是轮播图，为开发快速方便，我们常用的就是UI框架提供的Swiper、Carousel、Slider等封装好的轮播插件。但是，用UI框架提供的轮播图的话，一个是如果需要实现的轮播功能效果比较少就显得有点大材小用了，而且会使项目比较大，不大好优化管理；另外一个就是没有透明度的变化的轮播，我找了好几个UI框架都没有找到，最后还是选择了用JS封装了一个，以便后续使用。js实现透明度轮...
2018-09-15 22:46:09
1318
原创 矢量图和位图
从概念来看，矢量图：它是根据几何特性来绘制图形，是用线段和曲线描述图像，矢量可以是一个点或一条线。矢量图只能靠软件生成，矢量图文件占用内在空间较小，因为这种类型的图像文件包含独立的分离图像，可以自由无限制的重新组合。 位图：位图图像也称为点阵图像，位图使用我们称为像素的一格一格的小点来描述图像区别：分辨率：矢量图形与分辨率无关，可以将它缩放到任意大小和以任意分辨率在输出设备上打印出来，...
2018-09-13 14:29:44
3661
转载 vue项目打包后一片空白
修改在config文件夹下面的index.js中build模块导出的路径，assetsPublicPath默认的是’/’，也就是根目录。而index.html和static在同一级目录下面，所以改为’...
2018-09-12 10:17:01
371
原创 iscroll
iScroll是一个高性能，资源占用少，无依赖，多平台的javascript滚动插件。一般用来做 例如：上拉加载、下拉刷新.IScroll是一个类，每个需要使用滚动功能的区域均要进行初始化。每个页面上的iScroll实例数目在设备的CPU和内存能承受的范围内是没有限制的。官网http://iscrolljs.com，GitHub地址https://github.com/cubiq/iscr...
2018-09-10 17:29:12
495
原创 mockjs
Mock.js 是一款模拟数据生成器，旨在帮助前端工程师独立于后端进行开发，帮助编写单元测试。提供了以下模拟功能：根据数据模板生成模拟数据 模拟 Ajax 请求，生成并返回模拟数据 基于 HTML 模板生成模拟数据下载地址https://github.com/nuysoft/Mock/edit/refactoring/dist/mock.js，官方网址http://mockjs.co...
2018-09-10 16:22:43
566
转载 eval（）的相关用法
关于eval（data）和eval(“(“+data+”)”) 个人觉得在 Java数据处理过程中 虽然用一些 工具类也是可以实现字符串 与 json 对象互相转换， 但是 还是觉得用下 js 来做处理的话 会显得更好，有时候 Java 处理一些排序、大小比较之类的操作 换做是后端的话会显得比较麻烦点 ，此时用下前端的 js 处理会使者配合更好；更加突显各自的优势。 如果data是字符串...
2018-09-09 18:29:45
4254
原创 前端相关网站
前端学习过程中一些常用网站在此分享一下ICONFONT (阿里图标)http://www.iconfont.cn/collections/detail?spm=a313x.7781069.1998910419.d9df05512&cid=7077Ghost (基于 Node.js 的开源博客平台)http://www.ghostchina.com/about/特效相关...
2018-09-07 22:05:14
460
原创 canvas小案例
碰壁反弹<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>反弹</title> <style type="text/css"> *{ margin: 0; padd
2018-09-07 14:45:13
1355
转载 利用promise封装ajax,axios过程
封装ajaxvar url = 'https://hq.tigerbrokers.com/fundamental/finance_calendar/getType/2017-02-26/2017-06-10'; //...
2018-09-07 12:47:29
2117
原创 canvas基础
1.canvas是什么<canvas></canvas>是html5出现的新标签，和figure，seccion这些新标签不同的是canvas有自己的api,它可以像所有的dom对象一样，有自己本身的属性、方法和事件，其中比较好的就是绘图的方法，js能够调用它来进行绘图。2.canvas基本用法<canvas>标签的基本结构如下：<canv...
2018-09-07 12:39:14
152
转载 2018前端面试题
Q：什么情况下会碰到跨域问题？有哪些解决方法？跨域问题是这是浏览器为了安全实施的同源策略导致的，同源策略限制了来自不同源的document、脚本，同源的意思就是两个URL的域名、协议、端口要完全相同。script标签js...
2018-09-05 11:39:56
415
转载 2018前端面试题
前端面试笔试题： 1. 一个200*200的div在不同分辨率屏幕上下左右居中，用css实现div { position:absolute; width:200px; height:200px; top:50%; left:50%; margin-left:-50px; height:-50px; z-index:1000; } 2. 写一个左中右布局...
2018-09-05 11:36:44
1195
转载 2018最新Web前端经典面试试题及答案
本篇收录了一些面试中经常会遇到的经典面试题以及自己面试过程中遇到的一些问题，并且都给出了我在网上收集的答案。另外，宣传一下自己发布不久的一个前端vue的项目：基于vue2.0 +vuex+ element-ui后台管理系统。希望有兴趣的同学，可以一起共同...
2018-09-05 10:57:09
1062
原创 webpack构建react项目----实战篇2
上篇提到了webpack搭建react项目的整个步骤，但是写法主要是react15版的写法，这篇主要是用react16版的写法来配置，主要是和低版的形成一个对比。从目录上来看，配置文件什么的都基本上差不多，步骤见上篇。最大的不同就是组件里面app.js的写法的差异，模块的接收和暴露，一个是es5写法，一个是es6的写法。另外就是react高低版本对组件的声明方式的不同。//app.j...
2018-09-04 17:54:07
292
原创 webpack构建react项目----实战篇
可以用脚手架搭建react环境，比较快一点；但实际开发，公司常需要不使用现有的方法来搭建，这时候就需要自己去使用webpack自动化构建工具来搭建react项目的环境了。以下是简单的搭建步骤：1.创建目录，项目名为wpro 2.项目初始化 npm init3.安装webpack依赖 npm i webpack webpack-cli webpack-de...
2018-09-04 17:33:23
361
原创 webpack构建react项目--理论篇
用构建工具webpack构建react项目的原因：一、主要是react组件的特点 所有组件都写在一个js文件里面，不好维护，写多个js去引入也无法识别； 通过browser.js将jsx转换成js ，性能慢； 二、还有就是webpack自身特点 webpack是facebook为react量身打造的构建工具 webpack主要作用是实现模块化，代码整合，代码...
2018-09-03 19:38:53
122
富文本编辑器
2018-08-09
react基本引入文件
2018-08-04
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人