已解決430363個問題，去搜搜看，總會有你想問的

如何在類中編寫handleClick而不是在react js中導出默認函數

首頁猿問如何在類中編寫handleClic...

如何在類中編寫handleClick而不是在react js中導出默認函數

JavaScript

弒天下 2023-02-17 17:51:30

我是 React 的新手，我想在我的項目中使用材質 UI，我像這樣閱讀了菜單部分的文檔，但我無法編寫代碼，我的問題是如何將這部分轉換export default function為class PageHeader extends React.Component{} const ITEM_HEIGHT = 100; const [anchorEl, setAnchorEl] = React.useState(null); const open = Boolean(anchorEl); const handleClick = (event) => { setAnchorEl(event.currentTarget); }; const handleClose = () => { setAnchorEl(null); };

查看完整描述

1 回答

烙印99

TA貢獻1829條經驗獲得超13個贊

您鏈接的示例使用函數組件。我們可以將它們轉換為您想要的更傳統的類組件，或者您可以將函數用作組件 - 該示例能夠使用，<LongMenu />因為它是一個組件，只是使用函數而不是類聲明。React 文檔中有關于將函數組件轉換為類的信息。

使用類而不是函數時的一些關鍵點是類中并不真正存在的useState鉤子。useEffect相反，我們將狀態存儲為類中的一個字段，并使用生命周期方法。您提供的代碼段的類可能如下所示：

class PageHeader extends React.Component {

constructor(props) {

super(props);

this.state = {

anchorEl: null

};

}

handleClick = event => {

this.setState({ anchorEl: event.currentTarget });

}

handleClose = () => {

this.setState({ anchorEl: null });

}

render() {

return (...);

}

export default PageHeader;

我們可以存儲inuseState的狀態，并使用更新它，而不是使用鉤子。anchorElthis.statethis.setState

反對回復 2023-02-17

1 回答
0 關注
107 瀏覽

關注

添加回答

舉報

0/150

提交

取消

亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

熱搜

最近搜索清空

如何在類中編寫handleClick而不是在react js中導出默認函數

如何在類中編寫handleClick而不是在react js中導出默認函數

1 回答

添加回答