使用React函數(shù)式組件寫了一個身份驗證的一個功能，示例通過高階組件實現(xiàn)的一個效果展示：

import React, { useState, useEffect } from 'react';// 定義一個高階組件，它接受一個組件作為輸入，并返回一個新的包裝組件
const withAuthentication = (WrappedComponent) => {return function WithAuthentication(props) {const [isAuthenticated, setIsAuthenticated] = useState(false);// 模擬身份驗證過程，實際情況可能需要異步請求服務(wù)器驗證useEffect(() => {// 假設(shè)用戶已登錄setIsAuthenticated(true);}, []);// 根據(jù)身份驗證狀態(tài)渲染不同的內(nèi)容if (isAuthenticated) {return <WrappedComponent {...props} />;} else {return <p>請先登錄</p>;}};
};// 創(chuàng)建一個普通的函數(shù)式組件
function MyComponent() {return <div>這是需要身份驗證的組件</div>;
}// 使用高階組件包裝MyComponent以添加身份驗證功能
const AuthenticatedComponent = withAuthentication(MyComponent);// 在應(yīng)用中使用包裝后的組件
function App() {return (<div><h1>我的應(yīng)用</h1><AuthenticatedComponent /></div>);
}export default App;

在這個示例中，withAuthentication 是一個高階組件，它接受一個函數(shù)式組件 WrappedComponent 作為參數(shù)，并返回一個新的函數(shù)式組件 WithAuthentication。在 WithAuthentication 組件內(nèi)部，我們使用了 useState 和 useEffect 鉤子來模擬身份驗證過程，并根據(jù)身份驗證狀態(tài)渲染不同的內(nèi)容。

最后，我們在應(yīng)用中使用了 AuthenticatedComponent，它是通過高階組件 withAuthentication 包裝過的 MyComponent，從而添加了身份驗證功能。

這是一個適用于React函數(shù)式組件的高階組件示例，可以幫助你在函數(shù)式組件中實現(xiàn)類似的功能封裝和復(fù)用?？梢愿鶕?jù)自己的需求進(jìn)行代碼測試。