最近一直在学习React包括新特性都非常感兴趣，今天花了写时间，把Hooks的教程都看了一遍，感觉这个React-hooks十分有用
从网上帖子包括教程学习了很多，记了很多笔记。
有可能用了很多人的段落提前抱歉（毕竟笔记记得有些杂....）
看到很多人都在问React Hooks能否取代Redux
简单来说，这两项技术可以很好地互补。React Hooks不会替代Redux，仅仅为你提供来新的、更好的方式去组织你的React应用。
如果你最终决定使用Redux来管理状态，可以让你编写更好的连接组件。
所以，React Hooks不会取代Redux而是互补。
相反，开始问自己“我正在制作什么样的应用？我需要什么样的状态管理？Redux可以用吗，还是有些过度使用呢？hooks可以用吗，还是应该用类组件？如果我决定使用Redux和React Hooks（或者MobX和React Hooks，或者Redux和jQuery，不用React——这些都是有效的选择，取决于你正在做的事情），那么我怎样可以使这些技术互补并且和谐共处呢？”。
话不多说直接开始
React Hooks被开发出来主要是这三个理由：
难以复用类组件之间的逻辑
生命周期中经常包含一些莫名其妙的不相关逻辑
类组件难以被机器和人理解
hooks是另一种书写组件的方式，在hooks中只有函数而没有class。通过hooks提供的一系列API几乎可以完全覆盖class组件中的情况。hooks是更加简洁优雅的，逻辑分离的。
v16.8.hooks是react16.8版本新添加的功能。如果要使用hooks，需要确保react版本升级到16.8.0及以上，同时保证react-dom和react的版本保持一致。
百分之百向后兼容
react没有计划移除class组件。hooks是一种可选的写法，你依然可以选择不用而使用class（用过了你会喜欢上它）。
hooks中使用的依旧是class中的概念。
一个最简单的Demo
import React from 'react';
export default class Demo extends React.Component{
constructor(props){
super(props);
this.state = {
count: 0
};
}
componentDidMount(){
}
render(){
return(
<div className="Demo">
<p>You clicked {this.state.count} times</p>
<button onClick={() => this.setState({ count: this.state.count + 1 })}>
Click me
</button>
</div>
)
}
}
看一下使用hooks后的版本：
import { useState } from 'react';
function Demo() {
const [count, setCount] = useState(0);
return (
<div>
<p>You clicked {count} times</p>
<button onClick={() => setCount(count + 1)}>
Click me
</button>
</div>
);
}
