react+react-router+antd 栗子:https://github.com/Aquarius1993/reactApp
模块:
1. 引入模块
import React from 'react';
2. 导出组件
export default App;
3. 引用
import App from './APP.jsx';
组件:
1.  结构
class App extends React.Component {}
2. 设置state
用 constructor 代替 getInitialState:
getInitialState() {
return {liked: false};
}
======》
constructor(props) {
super(props);
this.state = {
liked: false
}
}
3. 设置默认Props
class LinkButton extends React.Component {
getDefaultProps() {
return {
name: 'Runoob'
};
} }
=====》
LinkButton.defaultProps = {name: 'Runoob'}
4.  props验证propTypes
propTypes: {
title: React.PropTypes.string.isRequired,
},
======》
LinkButton.propTypes = {title: React.PropTypes.string.required}
5. 事件绑定

<p onClick={this.handelClick}>点我切换状态</p>
=======》
<p onClick={e=>this.handelClick(e)}>点我切换状态</p> 

react 部分ES6写法的更多相关文章

  1. React,React Native中的es5和es6写法对照

    es6用在React中的写法总结: 在es6还没有完全支持到浏览器的阶段里,已经有很多技术人员开始用es6的写法来超前编程了,因为有转义es6语法的工具帮助下,大家才可大量使用.解析看看es6写法用在 ...

  2. 【转】React Native中ES5 ES6写法对照

    很多React Native的初学者都被ES6的问题迷惑:各路大神都建议我们直接学习ES6的语法(class Foo extends React.Component),然而网上搜到的很多教程和例子都是 ...

  3. 6周学习计划,攻克JavaScript难关(React/Redux/ES6 etc.)

    作者:余博伦链接:https://zhuanlan.zhihu.com/p/23412169来源:知乎著作权归作者所有.商业转载请联系作者获得授权,非商业转载请注明出处. 和大家一样,最近我也看了Jo ...

  4. React与ES6(四)ES6如何处理React mixins

    React与ES6系列: React与ES6(一)开篇介绍 React和ES6(二)ES6的类和ES7的property initializer React与ES6(三)ES6类和方法绑定 React ...

  5. scss + react + webpack + es6

    scss + react + webpack + es6 写在前面: 刚学习完慕课网里的一个幻灯片案例,自己加了刚学的react,两者结合.首先让大家看看效果 点击此处 你可以先用纯js实现上面的效果 ...

  6. react-native ES5与ES6写法对照表

    转载链接:http://www.ncloud.hk/%E6%8A%80%E6%9C%AF%E5%88%86%E4%BA%AB/react-native-es5-and-es6-writing-tabl ...

  7. 使用scss + react + webpack + es6实现幻灯片

    写在前面: 刚学习完慕课网里的一个幻灯片案例,自己加了刚学的react,两者结合.首先让大家看看效果 点击此处 你可以先用纯js实现上面的效果:我的github上的 JS代码 或者 观看慕课提供的课程 ...

  8. webpack+react+redux+es6开发模式

    一.预备知识 node, npm, react, redux, es6, webpack 二.学习资源 ECMAScript 6入门 React和Redux的连接react-redux Redux 入 ...

  9. React与ES6(三)ES6类和方法绑定

    React与ES6系列: React与ES6(一)开篇介绍 React和ES6(二)ES6的类和ES7的property initializer React与ES6(三)ES6类和方法绑定 React ...

随机推荐

  1. Django内置模版过滤器

    Django内置过滤器总览 可以查询下表来总览Django的内置过滤器: 过滤器 说明 add 加法 addslashes 添加斜杠 capfirst 首字母大写 center 文本居中 cut 切除 ...

  2. TinyXML用法小结2

    参考:http://www.cnblogs.com/hgwang/p/5833638.html TinyXML用法小结 1.      介绍 Tinyxml的官方网址:http://www.grinn ...

  3. 利用Chrome的Heap Snapshot功能分析一个时间段内的内存占用率

    在下图测试代码第13行和第16行设断点. 以调试方式运行,首先断点在第13行处触发: 打开Chrome开发者工具,点击Profiles tab, 再点击按钮"Take Snapshot&qu ...

  4. OpenGL入门程序三:点、线、面的绘制

    1.点: void TestPoint() { //点的大小默认为一个像素,通过下面的函数可以设置一点的大小 glPointSize(50.0f); glBegin(GL_POINTS); glVer ...

  5. c# 获取方法所在的命名空间 类名 方法名

    平时我们在记录日志的时候难免会需要直接记录当前方法的路径,以便查找,但是每次都输入方法名称非常的繁琐,同时如果修改了方法名称也要去手动修改日志内容,真的是劳命伤财啊,所以有了如下方法则可解决我们的大难 ...

  6. JPA、SpringData JPA 、Hibernate和Mybatis 的区别和联系

    一.JPA 概述 1. Java Persistence API(Java 持久层 API):用于对象持久化的 API 2. 作用:使得应用程序以统一的方式访问持久层 3. 前言中提到了 Hibern ...

  7. codeforces 1041d// Glider// Codeforces Round #509(Div. 2)

    题意:给出,n和飞行员高度h,n是区间数.在区间里飞行员高度不变,其它地方每秒高度-1,x坐标+1.问在高度变为0以前,x坐标最多加多少? 用数组gap记录本区间右端到下一个区间左端的距离.用sum记 ...

  8. js下载图片

    DownloadImgZP = imgPath => { const image = new Image(); // 解决跨域 Canvas 污染问题 image.setAttribute('c ...

  9. protobuf3.5.1使用的简单例子

    前言 1. 什么是protobuf Google Protocol Buffer( 简称 Protobuf) 是 Google 公司内部的混合语言数据标准,是一种轻便高效的结构化数据存储格式,平台无关 ...

  10. python-day10--文件处理

    1.文件:是操作系统提供的概念 2. open(r+'文件路径' , '打开方式' , '用什么字符编码')   #r 表示原始字符串 eg:open(r'C:\Users\13264\Desktop ...