Отключить ContextMenu в ReactJS

Question

первый пост здесь, так что, надеюсь, я могу задать этот вопрос самым полезным способом из всех возможных.Я довольно новичок в программировании и, пытаясь подтолкнуть себя, решил попытаться воссоздать Сапер, используя React, а не учебник.Я получил много функциональности, но я действительно застрял в этой части.Я использую прослушиватель событий 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 не вызовет контекстное меню