使用reactjs禁用后退按钮和刷新按钮

时间:2018-10-25 10:34:41

标签: reactjs

我不知道。

建议我在我的应用程序中禁用后退和刷新按钮的代码。

帮我提供代码*

1 个答案:

答案 0 :(得分:-1)

您需要使用state变量来启用和禁用按钮。 在下面的启用中查看,如果您单击resetreload,它将切换

class App extends React.Component{
  state = {
    isResetDisable: false,
    isReloadDisable: false,
  }
  handleButtonPress(token){
     console.log(token+" "+"pressed")
  }
  render(){
    return(
     <div>
         <div>
            <a onClick={()=>this.setState({isResetDisable: !this.state.isResetDisable})}> Click Reset lable to toggle button
            </a>
                <input disabled={this.state.isResetDisable}  type="button" value={this.state.isResetDisable ? 'Reset Disabled' : 'Reset Enable'} onClick={()=>{this.handleButtonPress('reset')}}/>
         </div>       
         
           
         <div>
          
           <a onClick={()=>this.setState({isReloadDisable: !this.state.isReloadDisable})}> Click Reload lable to toggle button
            </a>
                <input disabled={this.state.isReloadDisable}  type="button" value={this.state.isReloadDisable ? 'Reload Disabled' : 'Reload Enable'} onClick={()=>this.handleButtonPress('reload')}/>
                
         </div>
         
     </div>
    )
  }
}

ReactDOM.render(<App />, document.getElementById('root'));
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script>
<div id="root"></div>