陣營 - 隱藏菜單的onclick

Question

我還是當它涉及到的反應，我想創建一個隱藏的菜單，當你點擊一個按鈕，滑了一個初學者，這是我的工作：

import React from "react"; 
import {render} from "react-dom"; 
import styles from "./MenuCocktails.css"; 
import {BottomMenu} from "./BottomMenu"; 

export class BottomMenuButton extends React.Component{ 
constructor(){ 
     super(); 
     this.state ={ 
     shown: false 
    }; 

    } 
toggleMenu(){ 
    this.setState({shown: !this.state.shown}); 
} 
render(){ 
    return(
     <div><button onClick={this.toggleMenu.bind(this)} >My Cart</button> 

      if(this.state.shown == true) { 
       <BottomMenu/> 
      } 
      else{ 
      <p>Nothing to see</p> 
      } 

     </div> 
    ); 
    } 
    } 

任何幫助是極大的讚賞

Answer 1

你需要在構造函數中綁定toggleMenu：

constructor(){ 
     super(); 
     this.state = { 
     shown: false 
     }; 
     this.toggleMenu = this.toggleMenu.bind(this); 
    } 

可以有條件的邏輯改變你到一個班輪：

{this.state.shown ? <BottomMenu /> : <p>Nothing to see</p>} 

你的問題是什麼？什麼不起作用？你會得到什麼錯誤？