- 博客(96)
- 收藏
- 关注
RSS订阅转载 Configuration
一、configuration types1、exporting a object2、exporting a function输出的函数会注入两个参数：环境，options(描述了传给webpack的配置参数，比如output-filename和optimize-minimize).module.exports = function(env, argv) { r...
2018-01-08 18:40:00
228
转载 concepts
webpack是JS应用程序的静态模块打包工具。webpack在处理你的应用时，会递归的构建依赖项，这些依赖项包括你的应用程序所需要的所有模块，然后把这些模块打包到一个或多个bundles中。一、Entryentry point是项目的入口文件，告诉webpack从哪个模块开始构建内部依赖。进入入口文件后，webpack会直接或间接的找到其依赖的模块和库。1、定义入口的方式有...
2018-01-06 17:11:00
336
转载 react 问题记录
1、控制台报错：Uncaught Error: addComponentAsRefTo(...): Only a ReactOwner can have refs. You might be adding a ref to a component that was not created inside a component's `render` method, or you hav...
2017-10-18 12:05:00
327
转载 Nodejs入门
目录Process cwd chdir stdout stderr stdin exit 监听进程事件 exit uncaughtException 设置编码文件I/O 写入文件writeFile 追加写入appendFile 修改名字rename 移动文件rename 读取文件re...
2017-05-31 15:44:00
143
转载 vim常用操作
一、两种模式vim主要有两种模式，普通模式和插入模式。普通模式——>插入模式 通过按下i进入插入模式，可以像普通编辑器一样进行编辑插入模式——>普通模式 通过按下ESC进入普通模式，在普通模式可以进行很多操作二、常用命令下面列出的常用命令都是在普通模式下使用i ：进入插入模式，按ESC返回普通模式，在当前字符的左边新增文本I ：在当前行的...
2017-05-03 15:57:00
69
转载 git 本地仓库操作
一、git对象模型和存储二、常用命令1）git checkout branch 切换分支假设现在有两个分支，master和dev分支i dev分支上没有readme.txt 在master分支上我修改了readme.txt但是没有commit到本地仓库，那么在dev分支上仍然会看到readme.txt 在master分支上我修改了readme.txt...
2017-05-02 21:02:00
73
转载 git学习一——Pro-Git
1、配置用户名，邮箱git config --global user.name "Mike"git config --global user.email Mike@example.com2、查看配置信息git config --list也可以直接查阅某个环境变量的设定，只要把特定的名字跟在后面即可git config user.name...
2017-04-29 21:01:00
96
转载 React Router
一、安装安装命令如下：$ npm install -S react-router使用时，路由器Router就是React的一个组件。二、基本用法Router组件本身只是一个容器，真正的路由要通过Route组件定义。import { Router, Route, hashHistory } from 'react-router';impor...
2017-01-23 23:54:00
53
转载 webpack详述
一、利用package.json执行打包任务首先使用npm init生成package.json文件；然后配置scripts如下："scripts": { "build":"webpack", "start": "webpack-dev-server --hot --inline" }使用npm run build就可以编译文件，使用n...
2016-12-28 20:54:00
103
转载 webpack入门
一、安装1、安装nodeJS2、用npm安装webpacknpm install webpack -g此时 Webpack 已经安装到了全局环境下，可以通过命令行 webpack -h 试试。# 查看 webpack 版本信息$ npm info webpack# 安装指定版本的 webpack$ npm install webp...
2016-12-23 10:52:00
66
转载 受控组件 & 非受控组件
在 React 中表单组件可分为两类，受控与非受控组件.一、 受控组件设置了value的<input>是一个受控组件。 对于受控的<input>，渲染出来的 HTML 元素始终保持value属性的值。例如：render() { return <input type="text" value="Hello"/>...
2016-12-10 19:58:00
107
转载 SyntheticEvent
DOM事件一、绑定事件在 React 中绑定事件的方式很简单，只需要在元素中添加事件名称的属性已经对应的处理函数，事件名称和其他属性名称一样，服从驼峰式命名。如：class MyComponent extends React.Component{ constructor(props){ super(props); this...
2016-12-10 14:18:00
373
转载 ReactDOM & DOM Elements
一、ReactDOM1.1 render()ReactDOM.render(element,container,[callback])在container中渲染一个React元素，然后返回组件一个引用（对于stateless组件，返回null）。如果React元素已经加入到了container中，再次执行上面的方法会执行更新操作，只在必要时更新DOM来反映最新的Rea...
2016-12-09 22:23:00
182
转载 Lists and keys
function NumberList(props) { const numbers = props.numbers; const listItems = numbers.map((number) => <li key={number.toString()}> {number} </li> );...
2016-12-09 20:38:00
71
转载 Refs
一、The ref callback attributeref：reference，父组件引用子组件组件并不是真实的 DOM节点，而是存在于内存之中的一种数据结构，叫做虚拟DOM。只有当它插入文档以后，才会变成真实的 DOM 。根据 React 的设计，所有的 DOM 变动，都先在虚拟 DOM 上发生，然后再将实际发生变动的部分，反映在真实 DOM上，这种算法叫做DOM d...
2016-12-07 19:58:00
155
转载 Typechecking with PropTypes
React拥有内置的类型检测机制，为组件的props运行类型检测。PropTypes定义为组件类自身的属性，用以定义prop的类型。在开发模式下，当提供一个不合法的值作为prop时，控制台会出现警告；在产品模式下，为了性能考虑应忽略propTypesclass Greeting extends React.Component { render() { re...
2016-12-07 11:38:00
80
转载 props & children
一、 choosing the type at runtimeimport React from 'react';import { PhotoStory, VideoStory } from './stories';const components = { photo: PhotoStory, video: VideoStory};func...
2016-12-06 22:57:00
182
转载 state
大部分组件的工作应该是从props里取数据并渲染出来。但是，有时需要对用户输入、服务器请求或者时间变化等作出响应，这时需要使用 State。在编写React App时，尝试把尽可能多的组件无状态化。这样做能隔离 state，把它放到最合理的地方，也能减少冗余并，同时易于解释程序运作过程。常用的模式是创建多个只负责渲染数据的无状态（stateless）组件，在它们的上层创建一个有...
2016-12-03 00:12:00
115
转载 Symbol
一、基本用法ES6引入了一种新的原始数据类型Symbol，表示独一无二的值。它是JavaScript语言的第七种数据类型，前六种是：Undefined、Null、布尔值（Boolean）、字符串（String）、数值（Number）、对象（Object）。Symbol值通过Symbol函数生成。这就是说，对象的属性名现在可以有两种类型，一种是原来就有的字符串，另一种就是新增的...
2016-11-23 21:54:00
112
转载 对象的扩展
一、属性的简洁表示法ES6允许直接写入变量和函数，作为对象的属性和方法。这样的书写更加简洁。ES6允许在对象之中，直接写变量。这时，属性名为变量名, 属性值为变量的值。简洁写法的属性名总是字符串.var foo = 'bar';var baz = {foo};baz // {foo: "bar"}// 等同于var baz = {foo: foo};...
2016-11-23 18:28:00
87
转载 函数的扩展
一、函数参数的默认值ES6允许为函数的参数设置默认值，即直接写在参数定义的后面。function log(x, y = 'World') { console.log(x, y);}log('Hello') // Hello Worldlog('Hello', 'China') // Hello Chinalog('Hello', '') // ...
2016-11-22 19:44:00
143
转载 数组的扩展
一、 Array.from()Array.from方法用于将两类对象转为真正的数组：类似数组的对象（array-like object）和可遍历（iterable）的对象（包括ES6新增的数据结构Set和Map）。如果参数是一个真正的数组，Array.from会返回一个一模一样的新数组。function foo() { var args = Array.from(a...
2016-11-22 15:08:00
166
转载 字符串的扩展
JavaScript允许采用\uxxxx形式表示一个字符，其中“xxxx”表示字符的码点。但是，这种表示法只限于\u0000——\uFFFF之间的字符。超出这个范围的字符，必须用两个双字节的形式表达。"\uD842\uDFB7"// "????""\u20BB7"// " 7"上面代码表示，如果直接在“\u”后面跟上超过0xFFFF的数值（比如\u20BB7...
2016-11-21 12:44:00
109
转载 变量的解构赋值
一、数组的解构赋值基本用法ES6允许按照一定模式，从数组和对象中提取值，对变量进行赋值，这被称为解构。下面的代码表示，可以从数组中提取值，按照位置的对应关系对变量赋值。这种写法属于“模式匹配”，只要等号两边的模式相同，左边的变量就会被赋予对应的值。var [a,b,c]=[1,2,3]a // 1b // 2c // 3let [foo,[...
2016-11-20 17:19:00
134
转载 let & const 命令
一、let命令用于声明变量。1） 所声明的变量只在let命令所在代码块内有效。（块级作用域）{ let a=10; var b=1;}a // ReferenceError: a is not definedb // 1var li=document.getElementsByTagName("li");for(let ...
2016-11-20 16:13:00
58
转载 Grunt
一、从无到有构建Grunt项目1. 新建项目目录2. 在项目目录下新建index.html, js文件夹，js文件夹下新建index.js3. 运行命令npm init，填写项目的基本信息，生成package.json文件，生成package.json文件（如果老项目本身就是包含package.json的node项目则可以忽略这一步）4. 如果想在项目中引入grunt...
2016-11-15 23:10:00
82
转载 yeoman&bower
一、Yeoman在nodejs环境下安装：npm install -g yo然后安装所需要的generator,generator是npm包，命名为generator-xyz,比如安装angular的generator时npm install -g generator-angular然后进入你想要创建项目的目录下，运行yo angular...
2016-11-15 16:15:00
89
转载 英语一
1.Let me begin by explaining.Demolishing the building is out of the question.demolish:[dɪˈmɒlɪʃ]推翻;摧毁，拆毁（建筑物等）;毁坏，破坏;驳倒（论点、理论等）out of question: 毫无疑问out of the question: 不可能2. I’m s...
2016-11-14 11:39:00
117
转载 SASS基本特性
一、变量1.1 声明变量Sass 的变量包括三个部分：声明变量的符号“$”变量名称赋予变量的值来看一个简单的示例，假设你的按钮颜色可以给其声明几个变量：$brand-primary : darken(#428bca, 6.5%) !default; // #337ab7$btn-primary-color : #fff !defaul...
2016-11-08 20:41:00
1007
转载 SCSS语法格式及编译调试
一、SASS编译Sass 的编译有多种方法：命令编译GUI工具编译自动化编译1.1 命令编译1）单文件编译sass <要编译的Sass文件路径>/style.scss:<要输出CSS文件路径>/style.css2）多文件编译sass sass/:css/上面的命令表示将项目中“sass”文件夹...
2016-11-08 20:21:00
275
转载 React事件用法
一、事件处理函数的使用1.1 绑定事件处理函数1.2 使用<HelloWorld onClick={this.handleClick}/>大括号中指定的是this对象即当前组件引用的点击事件处理函数。注意这里不需要圆括号（this.handleClick()），如果用圆括号，则是执行函数，并将函数返回作为圆括号的运行结果赋值给onClic...
2016-11-07 22:46:00
91
转载 React生命周期
一、生命周期生命周期分成三个阶段，下面这些函数中带有will前缀的是在事情发生前调用的，带有did前缀的是在事情发生后调用的。Mounting阶段，当一个组件的实例被创建并插入到DOM中时，下面这些函数会被调用：constructor()componentWillMount：组件即将被渲染到页面上，render之前最后一次修改状态的机会render：生成虚...
2016-11-06 16:10:00
115
转载 JSX语法及特点介绍
1.1 基本语法1）自定义组件名首字母大写；元素名即组件名，首字母需要大写。首字母小写时React会以为这是HTML的标准标签，因此自定义的组件名需要首字母大写，否则会报错。2）嵌套；在render函数中return返回的只能包含一个顶层标签，否则也会报错。如：class HelloWorld extends React.Component{ rend...
2016-11-05 10:57:00
211
转载 针对全局对象、错误和表达式的服务
一、DOM API全局对象暴露DOM API特性的服务$anchorScroll 滚动浏览器窗口到指定的锚点$document 提供jqLite对象包括DOM window.document对象$location 提供URL入口$log 提供围绕console对象的封装$timeout 提供围绕window.setTimeout函数的增强封装$window...
2016-11-01 15:32:00
160
转载 模块与服务的协作
AngularJS模块定义了三个方法用于定义服务：factory、service、provider.一、使用factory方法创建服务最简单的方法就是使用module.factory方法，传入服务名称和factory函数作为参数并返回服务对象。通过工厂函数返回的对象是服务对象，工厂函数仅被调用一次，因为该对象创建和返回时使用的服务在应用程序中是必不可少的。Note: 当心别重...
2016-10-31 22:58:00
236
转载 创建自定义指令（二）
一、使用嵌入包含嵌入包含的意思是将一个文档的一部分通过引用插入到另一个文档中。在指令的上下文信息中，当你要创建一个可以包含任意内容的包装器指令时，这将十分有用。<script type="text/ng-template" id="template"> <div class="panel panel-default"> ...
2016-10-28 19:20:00
153
转载 创建自定义指令（一）
一、创建简单指令使用Module.directive方法来创建指令，参数是新指令的名称和一个用于创建指令的工厂函数。angular.module("exampleApp",[]) .directive("directiveName",function(){ return function(scope,element,attrs){ ...
2016-10-27 21:11:00
265
转载 jqLite
一、关于DOM导航的jqLite方法children() 返回一组子元素。这个方法的jqLite实现不支持jQuery所提供的选择器特性eq(index) 从一个元素集合中返回指定索引下的元素find(tag) 按照指定的tag名称定位所有的后代元素。它可以在一个元素的子元素、孙元素等所有后代元素中查找指定类型的元素。next() 获得下一个兄弟元素。不支持jquery所...
2016-10-25 20:48:00
215
转载 使用过滤器
过滤器在数据从作用域传递到指令上时进行转换，但并不改变源数据，这允许在视图中显示时能够灵活地格式化或者转换数据。AngularJS具有两种类型的内置过滤器：一类是对单个数据进行操作的，另一类是对数据集合进行操作的。一、过滤单个数据的值用于单个数据的内置过滤器currency 对货币值进行格式化，在过滤器名之后添加冒号：，然后添加一个字符串表示想替换成的符号，比如英镑符号。...
2016-10-25 15:55:00
120
转载 使用控制器和作用域
一、组织控制器1.1 使用一个单块控制器1.2 复用控制器你可以在同一个应用程序中创建多个视图并复用同一个控制器。AngularJS将会调用每个应用到控制器的工厂函数，结果是每个控制器实例将会拥有自己的作用域。1）作用域之间的通信作用域实际上是以层级结构的形式组织起来的，顶层是根作用域（rootScope），每个控制器都会被赋予一个新的作用域，该作用域是根作用域的一个...
2016-10-22 22:13:00
366
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人