reactjs - 对于ReactJS来说,从使用Container组件和Presentation组件到使用Hooks有什么变化?

标签 reactjs redux

以前,在ReactJS中,一种方法是将我们的组件分为Container组件和Presentational组件,甚至Dan Abramov wrote a note about it not any more the case如果我们现在可以使用 Hooks 的话。

现在应该怎么做——Hooks如何解决问题?

问题更像是:即使函数组件可以有状态,我们是否仍然应该将应用程序设计为具有具有状态的容器组件,并且具有严格没有状态的表示组件,因此就像“纯函数” ” 获取 Prop 并呈现数据。 或者我们不应该在我们拥有的每个组件中关心和使用状态吗?

最佳答案

使用钩子(Hook),您可以使功能组件有状态,这是一个示例

Const Component =()=>{
 Const [count, setCount]=useState(0);
 Return(
    <Button

      onClick={()=>setCount(count+1)}      
     >{count}</Button>)}

** 如果您比较基于类的组件和功能组件,您将看到钩子(Hook)如何减少代码,使阅读和理解更清晰,希望我解释得很好! **

关于reactjs - 对于ReactJS来说,从使用Container组件和Presentation组件到使用Hooks有什么变化?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/60593403/

相关文章:

javascript - 如何连接两个应用程序React/Node?

javascript - ReactJS:有一个带有绑定(bind)的类名,而另一个没有绑定(bind)的类名

javascript - Redux - 在 http 响应错误时从存储中删除对象

reactjs - Redux 的 combineReducers 和 TypeScript

java - Java/Kotlin Android 应用程序的通用应用程序状态架构?

javascript - 我如何使用 immutable.js 之类的东西在 Redux 中组合多个 combineReducers 函数

reactjs - redux-saga:如何以编程方式创建多个调用/副作用以获得 yield ?

javascript - 否则 jsx 在 react 中使用 <Link>

javascript - 如何在 React.Fragment 中通过 ID 获取元素?

javascript - 尽管使用 extraData,但删除最后一项后无法重新渲染 FlatList - React Native