在某些情況下，我們假設您必須在基於 React 類別的元件中使用 React hook 概念。
但是如你所知，如果你想在基於類別的元件中直接使用它們，反應鉤子只能在功能元件中工作。
它將出現錯誤。
那麼如何做呢，有一個解決方案。
有3步驟解
建立自訂 Hook
import {useState} from 'react';
const useGreet = () => {
const [text, setText] = useState('');
//... do any additional operation / hooks you want to add
return text;
}
建立高階組件
// import useGreet
export const MyHigherOrderComponentDemo = (Component) => {
return (props) => {
const text = useGreet();
return <Component text={text} {...props}/>;
}
}
將高階組件包裝在基於類別的組件中
// import useGreet
class MyClass extends React.component {
render() {
return (
<p>{this.props.text}</p>
)
}
}
export default MyHigherOrderComponentDemo(MyClass);
以上是類別元件中的 React Hook的詳細內容。更多資訊請關注PHP中文網其他相關文章！
