如何在React经典的`class`组件中使用React钩子？
在这个例子中，我有这个react类：
class MyDiv extends React.component
constructor(){
this.state={sampleState:'hello world'}
}
render(){
return <div>{this.state.sampleState}
}
}问题是，我是否可以在其中添加React钩子。我知道React-Hooks是React Class风格的替代。但是，如果我希望慢慢迁移到React钩子中，我可以将有用的钩子添加到类中吗？
回答 14
Stack Overflow用户
发布于 2019-01-17 07:43:20
在钩子出现之前，High order components就是我们一直做这类事情的方式。你可以为你的钩子写一个简单的高阶组件包装器。
function withMyHook(Component) {
return function WrappedComponent(props) {
const myHookValue = useMyHook();
return <Component {...props} myHookValue={myHookValue} />;
}
}虽然这并不是直接使用来自类组件的钩子，但这至少允许您使用来自类组件的钩子逻辑，而无需重构。
class MyComponent extends React.Component {
render(){
const myHookValue = this.props.myHookValue;
return <div>{myHookValue}</div>;
}
}
export default withMyHook(MyComponent);Stack Overflow用户
发布于 2018-11-19 17:14:55
类组件不支持钩子-
根据Hooks-FAQ的说法
您不能在类组件中使用钩子，但您绝对可以在单个树中使用钩子来混合类和函数组件。组件是使用Hooks的类还是函数是该组件的实现细节。从长远来看，我们希望钩子成为人们编写React组件的主要方式。
Stack Overflow用户
发布于 2018-11-19 17:15:45
钩子不是用来做类的，而是用来做函数的。如果您希望使用钩子，可以从编写新代码开始，将其作为带有钩子的函数组件
根据React FAQs的说法
您不能在类组件中使用钩子，但您绝对可以在单个树中使用钩子来混合类和函数组件。组件是使用Hooks的类还是函数是该组件的实现细节。从长远来看，我们希望Hooks成为人们编写React组件的主要方式。
const MyDiv = () => {
const [sampleState, setState] = useState('hello world');
render(){
return <div>{sampleState}</div>
}
}https://stackoverflow.com/questions/53371356
复制相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号