react怎麼取消右鍵

react取消右鍵的方法：1、開啟對應的react檔案；2、透過新增程式碼「componentDidMount(){document.oncontextmenu = function (e) {e = e || window.event;return false ;};}”來實現屏蔽瀏覽器預設右鍵事件即可。

本教學操作環境：Windows10系統、react18.0.0版、Dell G3電腦。

react怎麼取消右鍵？

react頁面中屏蔽瀏覽器預設右鍵事件

componentDidMount() {
    document.oncontextmenu = function (e) {/*屏蔽浏览器默认右键事件*/
        e = e || window.event;
        return false;
    };
}

相關拓展：

React componentDidMount() 方法

React 元件生命週期React元件生命週期

componentDidMount() 方法格式如下：

componentDidMount()

componentDidMount() 方法在元件掛載後（插入DOM 樹）立即呼叫。

依賴 DOM 節點的初始化應該放在 componentDidMount() 方法中。

以下實例會先輸出runoob，然後使用componentDidMount() 方法設定在元件掛載後輸出google：

實例

class Header extends React.Component {
  constructor(props) {
    super(props);
    this.state = {favoritesite: "runoob"};
  }
  componentDidMount() {
    setTimeout(() => {
      this.setState({favoritesite: "google"})
    }, 1000)
  }
  render() {
    return (
      <h1>我喜欢的网站是 {this.state.favoritesite}</h1>
    );
  }
}
 
ReactDOM.render(<Header />, document.getElementById(&#39;root&#39;));

推薦學習：《react影片教學》

以上是react怎麼取消右鍵的詳細內容。更多資訊請關注PHP中文網其他相關文章！