在ReactJS中禁用ContextMenu

Question

首先發布在這里，希望我能以最有用的方式提出這個問題。 我對編碼很新，並試圖推動自己決定嘗試使用React重新創建Minesweeper而不使用任何教程。 我已經獲得了很多功能，但我確實堅持這一部分。 我正在使用事件監聽器'onContextMenu'來注冊右鍵以“標記”程序中的一個地雷。 但我無法找到隔離它的正確方法，或者這可能是一個語法問題，導致菜單無法同時彈出。 在JS中，在事件監聽器上返回false似乎很簡單，但我無法在React中弄明白。

我正在使用'onContextMenu'來處理我的右鍵單擊並調用一個函數來處理該事件監聽器的標志賦值。 我是否也可以在函數內禁用contextMenu顯示？

感謝您提供的任何幫助！

正在渲染的div現在看起來像這樣：

<div
   contextMenu="none"
   className="square"
   onContextMenu={() => this.props.rightClick(props.arrayVal)}
   onClick={() => {this.props.playerTurn(this.props.index)}}
   style={{color:COLORS[this.props.arrayVal], backgroundImage:this.backgroundChooser(this.props.arrayVal)}}
    >
       {this.squareContent(this.props.arrayVal)}
</div> 

被調用的函數如下所示：

rightClick = (id) => {
    let { board, gameWon, minesLeft } = this.state
    let mineCount = minesLeft
    let move = board
    if (gameWon === false) {
        if (board[id] === -1) {
            move[id] = 9
            mineCount -= 1
        } else if (board[id] === 9) {
            move[id] = "?"
            mineCount += 1
        } else if (board[id] === "?") {
            move[id] = -1
        }
        this.setState({
            board: move,
            minesLeft: mineCount
        })
    }
}

我能夠浪費另一段時間並讓一位資深的開發朋友為我看這個。 這是解決方案。 希望它可以幫助別人:-)！ 見下面的評論：

Answer 1

我知道它是一個舊的但是我的解決方案：首先，選擇你想要禁用contextMenu的元素（在這種情況下它是一個div元素），然后將這個片段添加到元素：

<div onContextMenu={(e)=> e.preventDefault()}... />

右鍵單擊上面的div將不會觸發上下文菜單