- 博客(22)
- 收藏
- 关注

原创 react-router v4 嵌套路由实现
1. react-router4.0以下的嵌套路由实现 :嵌套的路由可以放在一个router标签中,形式如下,嵌套的路由也直接放在一起。<Route component={App}> <Route path="groups" components={Groups} /> <Route path="users" components={Users}> ...
2018-03-20 14:50:52
1697
原创 es6 正则表达式扩展
1.Regex构造函数:当第一个参数为正则表达式时,允许传递正则表达式修饰符作为第二个参数。并且,返回的正则表达式会忽略原有的修饰符,使用指定的修饰符。2.修饰符:u修饰符:用来正确处理大于\uFFFF的unicode字符。y修饰符:与g修饰符类似,也是全局匹配,后一次匹配都从上一次匹配成功的下一个位置开始。不同之处在于,g修饰符只要剩余位置中存在匹配就可,而y修饰符确保匹配必须从...
2018-04-09 11:09:13
244
原创 webpack配置详解
1.使用模式:(1).CLI模式:也就是命令行用户界面。例如:webpack example1.1.js bundle1.1.js如果我们直接执行webpack,不加任何参数(且当前目录不存在配置文件),则会显示webpack的帮助信息,里面有非常多的参数可用。事实上,除了我们前面这种出于演示的目的直接在命令行中写参数之外,大部分生产环境下使用时都会需要加上非常多的参数,导致整个命令非常长,既不利...
2018-03-23 17:45:32
1198
原创 Failed to decode downloaded font(线上环境字体图标不显示)
1.问题:maven项目使用Bootstrap时,出现 "Failed to decode downloaded font"和"OTS parsing error: Failed to convert WOFF 2.0 font to SFNT"导致图标出不来的问题。2.原因:上面的xml里也写了,因为经过maven的filter,会破坏font文件的二进制文件格式,到时前台解析出错。3.解决方案...
2018-03-23 11:01:00
16548
原创 Uncaught TypeError: cannot read property call of undefined (webpack打包出错)
extract-text-webpack-plugin问题: new ExtractTextPlugin({ filename: '[name].[hash].css', allChunks: true })webpack官网的解释:new ExtractTextPlugin(options: filename | object)NameTypeDescrip...
2018-03-23 10:51:15
5046
原创 react-routerv4.0+webapck实现js按需加载
借助bundle-loader来实现按需加载。(以下三个步骤)1.新建一个bundle.js文件。import React, { Component } from 'react';export default class Bundle extends React.Component { state = { // short for "module" but that'...
2018-03-23 10:39:24
547
原创 react-routerv4.0学习总结
1.引用:react-router还是react-router-dom?这两个包这要引用一个就可以了,不同之处在于后者比前者多了类似于<Link>、<BrowerRouter>这样的DOM组件。大多数情况下,我们将会引用react-router-dom。如果搭配redux,还需要引用react-router-redux。2.<Route>组件:当页面的url地址...
2018-03-20 17:31:29
1217
原创 递归生成嵌套路由(react-router 4.0以下)
function descRouter(routes) { return routes.map((route, i) => { if (route.routes) { return ( <Route component={route.component} path={route.path}> ...
2018-03-20 15:42:25
2205
1
原创 将给定格式的线性结构转换为树形结构
在前端开发过程中,经常会遇到各种各样的数据解析问题,今天来说明一下如何将给定格式的线性结构转换为树形结构。1.后端返回的源数据:s{ "status": "success", "datas": [ { "id": 1, "name": "指标1",
2017-11-25 13:00:17
1321
原创 mongodb
1.命令行下运行 MongoDB 服务器C:\mongodb\bin\mongod --dbpath c:\data\db2.连接MongoDBC:\mongodb\bin\mongo.exe
2017-11-12 19:58:59
180
原创 Webstorm Unused default export
这个其实是webstorm的变量语法检查提示,你去修改一下它的配置就好了。配置webstorm的变量检查,在webstorm右下角有个小人,点一下,然后再点击configure inspections弹出弹框后在输入框搜索javascript general unused。你点选或者去除其中的几个(我记不得是哪个了)。就可以消失了,记得保存
2017-11-08 14:13:04
7898
1
原创 webstorm激活
2017-06-15更新 之前都是使用2017.2.27的方法,版本是2017.1.1,还没提示过期,但是根据评论说这个链接已经失效了,评论也给出了个新地址:http://idea.iteblog.com/key.php 感谢 @qq_35381272 友情提供2017.2.27更新 选择“license server” 输入:http://idea.imsxm.com/2016.2.
2017-11-07 15:54:40
183
原创 npm->cnpm
npm install -g cnpm --registry=https://registry.npm.taobao.org// 使用cnpm install ...
2017-11-02 13:26:08
277
原创 webstorm安装
WebStorm2017.1WebStorm是JetBrains 推出的一款强大的HTML5编辑工具,拥有丰富的代码快速编辑,可以智能的补全代码、代码格式化、html提示以及代码检查和快速修复等,支持不同浏览器的提示,同时也是一款JavaScript 开发工具,拥有即时编辑(chrome)、自动完成、debugger、Zen Coding、HTML5 支持、JSLint、Less支持、
2017-10-30 21:48:06
346
转载 chrome浏览器调试
怎样打开Chrome的开发者工具?直接在页面上点击右键,然后选择审查元素:或者在Chrome的工具中找到:或者,你直接记住这个快捷方式: Ctrl+Shift+I (或者Ctrl+Shift+J直接打开控制台),或者直接按F12。打开的开发者工具就长下面的样子:不过我一般习惯与点右上角的那个按钮,将开发者工具弹出作为一个独立的窗口:Eleme
2017-10-28 14:52:51
174
转载 bootstrap打开模态modal窗口引起页面抖动闪黑
在使用bootstrap的modal模态窗口组件时,触发后会发现页面有抖动现象。这是因为它隐藏了浏览器滚动条,页面就相当于变宽了,关闭模态窗口后,页面又出现滚动条,页面又变窄了,这一伸一缩就会使页面产生抖动现象。我的解决方法很简单,就是干掉隐藏滚动条的代码。总共删除bootstrap.js文件中6行代码就可以了。以bootstrap3.3.6版本中未压缩的bootstrap.js文件为例。
2017-10-28 11:40:41
1211
原创 js高级程序设计(5-7章小结)
一.对象在js中被称为引用类型的值,而且有一些内置的引用类型可以用来创建特定的对象,总结如下:1.引用类型与传统面向对象程序设计中的类相似,但实现不同。2.Object是一个基础类型,其他所有类型都从Object继承了基本的行为。3.Array类型是一组值的有序列表,同时还提供了操作和转换这些值的功能。4.Date类型提供了日期和时间的信息,包括当前日期和时间,以及相关的计算功能。
2017-03-28 22:10:47
374
原创 js高级程序设计(第6章----继承)
一.ES只支持实现继承,而且其实现继承主要是依靠原型链来实现的。1.原型链(1)利用原型让一个引用类型继承另一个引用类型的属性和方法。(2)问题:包含引用类型的值的原型属性会被所有实例共享;通过原型来实现继承时,原型实际上会变成另一个类型的实例,原来的实例属性也就变成了现在的原型属性了。 在创建子类型的实例时,不能向超类型的构造函数中传递参数。functio
2017-03-24 23:29:41
259
原创 js高级程序设计(第6章---创建对象)
一.es支持面向对象编程,但不使用类或接口。对象可以在代码执行过程中创建和增强,因此具有动态性而非严格定义的实体。二.创建对象的方式1.工厂模式:(1)抽象了创建对象的具体过程(2)缺:解决了创建多个相似对象的问题,但是却没有解决对象识别问题function createperson (name, age, job) {var o = new Object();o.na
2017-03-23 21:44:35
364
原创 js高级程序设计(1-4章小结)
一.js简介js是一种专为与网页交互而设计的脚本语言,由三个部分组成:ECMAScript,由ECMA-262定义,提供核心语言功能。文档对象模型,提供访问和操作网页内容的方法和接口。浏览器对象模型,提供与浏览器交互的方法和接口。二.在HTML中使用js1.把js插入到html页面要使用元素,可以把js嵌入到html页面中,让脚本与标记混合在一起;也可以包含外部的js文件。
2017-03-20 18:55:48
305
原创 canvas绚丽的倒计时效果
1.index.html<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title></head><body style=&q
2017-03-05 20:58:17
571
原创 Html5--canvas时钟
1.index.html<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <style type="text/css"
2017-03-05 14:08:45
257
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人