第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號(hào)安全,請(qǐng)及時(shí)綁定郵箱和手機(jī)立即綁定
已解決430363個(gè)問(wèn)題,去搜搜看,總會(huì)有你想問(wèn)的

React Hook“useState”無(wú)法在類組件中調(diào)用。

React Hook“useState”無(wú)法在類組件中調(diào)用。

哈士奇WWW 2023-09-28 16:22:33
我是 React 前端開(kāi)發(fā)的新手。我正在嘗試向我的 Material-UI 導(dǎo)航欄添加一個(gè)臨時(shí)抽屜。我在代碼中添加了一個(gè)抽屜:class Navbar extends Component {    render() {        const { authenticated } = this.props;        const [open, setOpen] = useState(false);        const handleDrawer = () =>{           setOpen(true)        }        return (            <AppBar position="fixed">                <Toolbar className="nav-container">                    {authenticated ? (                        <Fragment>                            <IconButton edge="start" onClick={handleDrawer} >                                <Menu/>                            </IconButton>                            <Drawer                                anchor='left'                                open={open}                                onClose={()=> setOpen(false)}                                >                                    <h3> Drawer</h3>                            </Drawer>                            <NewPost/>                            <Link to="/">                                <MyButton tip="Home">                                    <HomeIcon color = "disabled"/>                                </MyButton>                            </Link>                            <Link to="/chats">                                <MyButton tip="Chats">                                    <ChatIcon color = "disabled"/>                                </MyButton>                            </Link>                            <Notifications />                        </Fragment>                                            )
查看完整描述

5 回答

?
吃雞游戲

TA貢獻(xiàn)1829條經(jīng)驗(yàn) 獲得超7個(gè)贊

狀態(tài)鉤子 (useState) 可用于功能性 React 組件,但在您的情況下,您使用的是類組件。函數(shù)式 React 組件通常沒(méi)有開(kāi)箱即用的狀態(tài),但這useState是一個(gè)新功能,可以讓您解決這個(gè)問(wèn)題

您可以將其更改為功能組件,也可以將其保留為類組件并以不同的方式使用狀態(tài),例如:

  • !this.state.open而不是!open 和

  • this.setState({open: false})代替setOpen(false)

https://reactjs.org/docs/hooks-state.html


查看完整回答
反對(duì) 回復(fù) 2023-09-28
?
喵喵時(shí)光機(jī)

TA貢獻(xiàn)1846條經(jīng)驗(yàn) 獲得超7個(gè)贊

將此行更改const [open, setOpen] = useState(false);this.state = { open: false };

當(dāng)設(shè)置為 true 時(shí),只需調(diào)用 this.setState({ open: this.state.open: true })


查看完整回答
反對(duì) 回復(fù) 2023-09-28
?
紅糖糍粑

TA貢獻(xiàn)1815條經(jīng)驗(yàn) 獲得超6個(gè)贊

您必須使用功能組件。目前你的組件是一個(gè)類組件,所以你應(yīng)該有類似的東西:


const Navbar = (props) => {

  const { authenticated } = props;

  const [open, setOpen] = useState(false);

  const handleDrawer = () =>{

    setOpen(true)

  }

    

  return (

    <AppBar position="fixed">...</AppBar>

  );

};

我還注意到您的類組件具有在渲染方法中定義的狀態(tài)部分。使用類組件時(shí),應(yīng)該在constructor中定義狀態(tài),否則每次渲染時(shí)您的狀態(tài)都會(huì)被覆蓋。


查看完整回答
反對(duì) 回復(fù) 2023-09-28
?
幕布斯7119047

TA貢獻(xiàn)1794條經(jīng)驗(yàn) 獲得超8個(gè)贊

使用function Navbar(props)代替class Navbar extends Component

這是因?yàn)?,有一個(gè)規(guī)則:React Hook“useState”不能在class componenteg中調(diào)用class Navbar extends Component。React function componentReact Hooks 必須在例如function Navbar(props)或自定義 React Hook 函數(shù)中調(diào)用


查看完整回答
反對(duì) 回復(fù) 2023-09-28
?
富國(guó)滬深

TA貢獻(xiàn)1790條經(jīng)驗(yàn) 獲得超9個(gè)贊

函數(shù)組件而不是類組件怎么樣?如您所知,推薦使用功能組件。我認(rèn)為它很容易編碼并且可以提高性能。


const Navbar = () => {

     //useState, define functions here

     return (//the same as render method of your class component) 

}


查看完整回答
反對(duì) 回復(fù) 2023-09-28
  • 5 回答
  • 0 關(guān)注
  • 236 瀏覽
慕課專欄
更多

添加回答

舉報(bào)

0/150
提交
取消
微信客服

購(gòu)課補(bǔ)貼
聯(lián)系客服咨詢優(yōu)惠詳情

幫助反饋 APP下載

慕課網(wǎng)APP
您的移動(dòng)學(xué)習(xí)伙伴

公眾號(hào)

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號(hào)