当前位置:首页 > 日记 > 正文

ES6下React组件的写法示例代码

ES6下React组件的写法示例代码

本文主要跟大家分享了ES6下React组件的写法示例,下面来一起看看详细的介绍:

一:定义React组件

class Hello extends React.Component { render() {  return <h1>Hello, {this.props.value}</h1>; }}

二:声明prop类型与默认prop

class Hello extends React.Component { // ...}Hello.propTypes = { value: React.PropTypes.string};Hello.defaultProps = { value: 'world'};

三、设置初始state

class Hello extends React.Component { constructor(props) {  super(props);  this.state = {count: props.initialCount}; } // ...}

四、自动绑定

class SayHello extends React.Component { constructor(props) {  super(props);  this.state = {message: 'Hello!'};  // 这行很重要  this.handleClick = this.handleClick.bind(this); } handleClick() {  alert(this.state.message); } render() {  // Because `this.handleClick` is bound, we can use it as an event handler.  return (   <button onClick={this.handleClick}>    Say hello   </button>  ); }}

总结

以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作能带来一定的帮助,如果有疑问大家可以留言交流,谢谢大家对的支持。

相关文章

怎么在excel2007设置宏在excel2007

怎么在excel2007设置宏在excel2007

设置,步骤,方法,电脑软件,  Excel 电子表格处理软件中有一个宏选项,功能非常强大,一般默认是关闭状态。有的朋友在收到一些电子表格软件时,提示需要启用宏选项才可以打开。下面小编教你怎么在excel2007中打开宏,希望对你有帮助!excel2007中设…

WPS演示如何插入页码WPS演示插入页

WPS演示如何插入页码WPS演示插入页

方法,页码,演示,电脑软件,WPS,  在使用WPS演示制作幻灯片时,有时需要在幻灯片里插入页码,那么怎么在幻灯片里插入页码呢?下面小编教你怎么做吧。wps演示插入页码的方法首先在电脑上打开wps演示软件,并新建一个空白文档,如下图所示。wps演示插…

ppt如何给幻灯片设置背景

ppt如何给幻灯片设置背景

方法,设置,幻灯片,背景,电脑软件,  我们有时需要在ppt上添加背景,应该怎么做呢?一份好的PPT不仅可以吸引观众的眼球同时还可以反映自己的制作能力,下面就让小编告诉你ppt添加幻灯片背景的方法,希望小编整理的资料对大家有帮助。ppt幻灯片添…

word2017打不开怎么办

word2017打不开怎么办

解决方法,打开文件,打不开,电脑软件,  很多朋友在更新了word2017之后,打开文件时都会出现错误,遇到这些问题怎么解决呢?下面给大家分享word2017打开文件出错的解决方法。word2017打开文件出错的解决方法1、新建空白Word文档,如下图&mdash;&m…

JavaScript数据结构之双向链表和双

JavaScript数据结构之双向链表和双

数据结构,双向循环链表,双向链表,电脑软件,JavaScript,双向链表和普通链表的区别在于,在链表中,一个节点只有链向下一个节点的链接,而在双向链表中,链接是双向的:一个链向下一个元素,另一个链向前一个元素。 双向链表提供了两种迭代列表的方法:从…

Javascript | es2016 import和requ

Javascript | es2016 import和requ

详解,区别,电脑软件,Javascript,require,本文介绍了Javascript(es2016) import和require用法和区别详解,分享给大家,具体如下:写个简单js文件,假设名字为:lib.js 。 假设内容如下:export const sqrt = Math.sqrt;export function square(x) { ret…

excel表格设置页码的教程

excel表格设置页码的教程

教程,设置,页码,表格,电脑软件,  Excel中的表格该如何设置页码呢?接下来是小编为大家带来的excel表格设置页码的教程,供大家参考。excel表格设置页码的教程:  设置页码步骤1:点击&ldquo;页面布局&rdquo;下&ldquo;页面设置&rdquo;中右下角…

Excel表格数据怎么使用内容重排的

Excel表格数据怎么使用内容重排的

重排,数据,表格,功能,内容,  在网站上搜索到要找的数据,却发现复制到excel中数据全部挤在一个单元格中。 这样也就无法对数据进行处理。如果解决数据挤在一行的问题!答案是用EXCEL内容重排功能!内容重排的功能就是将一个单元格的内容按照…

excel2007 保存工作区教程

excel2007 保存工作区教程

教程,工作区,电脑软件,  在Excel中往往不能在当天完成工作需要第二天继续完成,这个时候就要把工作簿保存为工作区了,想必有些朋友会不太懂,不过没关系,我们一起来学习一下如何保存工作区。下面是小编带来的关于excel2007 保存工作区教程,希望…

word如何从任意页开始编页码word从

word如何从任意页开始编页码word从

方法,步骤,设置,页码,电脑软件,  我们编辑Word时候经常需要从Word中的某一页开始编页码。比如说前面是封面和目录,后面的正文才可以编页码,如何实现呢?下面小编教你word如何从任意页开始编页码,希望对你有帮助!word从任意页开始编页码的方法…

最非主流的个性签名个性签名大全伤

最非主流的个性签名个性签名大全伤

推荐,个性签名,非主流,伤感,优秀,  最非主流的个性签名有哪些?非主流文化是相对于主流文化而言的;非主流文化一开始无论是在价值导向、接受程度上都与主流文化有很大的差异;然而非主流文化往往代表的是一种新生文化现象,在文化表现形式和…

怎么设置word自动索引目录设置word

怎么设置word自动索引目录设置word

索引,设置,方法,步骤,目录,  实际和论文的编写都可能会在word中插入目录,但是如何才能编辑出精美的文档目录呢?下面小编来告诉你吧。word自动索引目录的步骤打开需要进行目录编辑的文档。word自动索引目录的步骤图1  对标题格式进行设置…