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. Java DecimalFormat的主要功能及使用方法

    DecimalFormat 是 NumberFormat 的一个具体子类,用于格式化十进制数字.该类设计有各种功能,使其能够分析和格式化任意语言环境中的数,包括对西方语言.阿拉伯语和印度语数字的支持. ...

  2. Qt_OpenGL_教程

    1. 中文版: Qt OpenGL教程 http://blog.csdn.net/myths_0/article/details/24431597 http://qiliang.net/old/neh ...

  3. Tomcat启动之异常java.lang.IllegalStateException

    严重: Exception sending context destroyed event to listener instance of class org.springframework.web. ...

  4. 算法笔记--2-sat

    强连通分量的应用,详见<挑战程序设计>P324 例题1:HDU Peaceful Commission 思路:强连通分量分解,看有没有两个同一个国家的代表在一个强连通分量里,如果有,就是N ...

  5. angular5 表单元素 checkbox radio 组讲解

    一.checkedbox 1.ngModel绑定方式 <input [(ngModel)]="item.checked" value="item.checked&q ...

  6. ubuntu下php无法载入mysql扩展

    最近在想使用wordpress搭建一个网站,从godaddy上购买域名开始,各种问题,不过庆幸的是都已经逐一解决了. Your PHP installation appears to be missi ...

  7. TCP和UDP最完整的区别

    TCP与UDP基本区别  1.基于连接与无连接  2.TCP要求系统资源较多,UDP较少:   3.UDP程序结构较简单   4.流模式(TCP)与数据报模式(UDP);   5.TCP保证数据正确性 ...

  8. zzuli 1875多线DP

    1875: 蛤玮的财宝 Time Limit: 1 Sec  Memory Limit: 128 MBSubmit: 530  Solved: 116 SubmitStatusWeb Board De ...

  9. 基础最短路(模板 spfa)

    Description 虽然草儿是个路痴(就是在杭电待了一年多,居然还会在校园里迷路的人,汗~),但是草儿仍然很喜欢旅行,因为在旅途中 会遇见很多人(白马王子,^0^),很多事,还能丰富自己的阅历,还 ...

  10. 网络编程基础——System.Net.Socket 命名空间及相关类的使用

    System.Net.Socket 命名空间主要提供制作 Socket 网络应用程序的相关类.(Socket 类.TcpClient 类.TcpListener 类 和 UdpClient 类) 1. ...