Javascript 奥赛罗的游戏切换不';t在React.js中工作

Javascript 奥赛罗的游戏切换不';t在React.js中工作,javascript,reactjs,othello,Javascript,Reactjs,Othello,我正在制作React中的奥赛罗游戏,我已经实现了切换玩家回合的代码。它确实可以从一个切换到另一个(在白色和黑色之间)。但是如果下一个玩家没有可用的移动,回合将保持不变。虽然我已经做了所有的事情,但现在我遇到了这样的情况下,尝试游戏,虽然它确实切换球员轮流,我的代码不考虑保持它在必要时相同。你知道为什么吗?我怎样才能解决它 这是我的密码: 我在哪里更改它: setWinnerAndTurn() { const history = this.state.history.sli

我正在制作React中的奥赛罗游戏,我已经实现了切换玩家回合的代码。它确实可以从一个切换到另一个(在白色和黑色之间)。但是如果下一个玩家没有可用的移动,回合将保持不变。虽然我已经做了所有的事情,但现在我遇到了这样的情况下,尝试游戏,虽然它确实切换球员轮流,我的代码不考虑保持它在必要时相同。你知道为什么吗?我怎样才能解决它

这是我的密码:

我在哪里更改它:

    setWinnerAndTurn() {
        const history = this.state.history.slice(0, this.state.stepNumber + 1);
        const current = history[this.state.stepNumber];
        const squares = current.squares.slice()

        const blackSquares = []
        const whiteSquares = []
        // Check for a winner
        for (var row=0;row<squares.length;row++) {
            for (var col=0;col<squares[row].length;col++) {
                if (squares[row][col] === 'black') {
                    blackSquares.push([row,col])
                } else if (squares[row][col] === 'white') {
                    whiteSquares.push([row,col])
                }
            }
        }

        // Debug
        //console.log(blackSquares)
        //console.log(whiteSquares)
        

        const total = [blackSquares,whiteSquares]
        const movesAvailable = [[],[]]
        for (var t=0;t<total.length;t++) {
            const currentArray = total[t]
            const returned = this.checkElementsAround(currentArray)
            for (var r=0;r<returned.length;r++) {
                movesAvailable[t].push(returned[r])
            }
        }

        // Debug
        console.log(movesAvailable)


        if (blackSquares.length + whiteSquares.length === squares.length * squares[0].length || (movesAvailable[0] === [] && movesAvailable[1] === [])) {
            // Declare a winner
            if (blackSquares.length !== whiteSquares.length) {
                this.setState({
                    winner: (blackSquares.length > whiteSquares.length) ? 'black' : 'white'
                })
            } else {
                this.setState({
                    winner: 'tie'
                })
            }
        } else {
            // Change turn
            if (movesAvailable[0] === []) {
                this.setState({
                    blackIsNext: false
                })
            } else if (movesAvailable[1] === []){
                this.setState({
                    blackIsNext: true
                })
            } else {
                this.setState({
                    blackIsNext: !this.state.blackIsNext
                })
            }
        }
    }
setWinnerAndTurn(){
const history=this.state.history.slice(0,this.state.stepNumber+1);
const current=history[this.state.stepNumber];
const squares=当前的.squares.slice()
常数黑方块=[]
const whiteSquares=[]
//检查是否有赢家

for(var row=0;row解决了问题,但不知道如何解决。这很奇怪

代码如下:

setWinnerAndTurn() {
        const history = this.state.history.slice(0, this.state.stepNumber + 1);
        const current = history[this.state.stepNumber];
        const squares = current.squares.slice()

        const blackSquares = []
        const whiteSquares = []
        // Check for a winner
        for (var row=0;row<squares.length;row++) {
            for (var col=0;col<squares[row].length;col++) {
                if (squares[row][col] === 'black') {
                    blackSquares.push([row,col])
                } else if (squares[row][col] === 'white') {
                    whiteSquares.push([row,col])
                }
            }
        }
        
        const valids = this.checkElementsAround(this.checkEmptySpaces())

        // checkEmptySpaces returns all the empty spaces in the game
        // checkElementsAround returns all the objects in all directions if there's initially an element in that direction

        const movesAvailable = [0,0]

        for (var t=0;t<2;t++) {
            const isBlack = (t === 0) ? true : false
            for (var v=0;v<valids.length;v++) {
                const valid = valids[v]
                const turned = this.checkTurningStones(valid.directions,isBlack)
                if (turned.length !== 0) {
                    movesAvailable[t]++;
                }
            }
        }

        if (blackSquares.length + whiteSquares.length === squares.length * squares[0].length || (movesAvailable === [0,0])) {
            // Declare a winner
            if (blackSquares.length !== whiteSquares.length) {
                this.setState({
                    winner: (blackSquares.length > whiteSquares.length) ? 'black' : 'white'
                })
            } else {
                this.setState({
                    winner: 'tie'
                })
            }
        } else {
            // Change turn
            if (movesAvailable[0] === 0) {
                this.setState({
                    blackIsNext: false
                })
            } else if (movesAvailable[1] === 0){
                this.setState({
                    blackIsNext: true
                })
            } else {
                this.setState({
                    blackIsNext: !this.state.blackIsNext
                })
            }
        }
    }

setWinnerAndTurn(){
const history=this.state.history.slice(0,this.state.stepNumber+1);
const current=history[this.state.stepNumber];
const squares=当前的.squares.slice()
常数黑方块=[]
const whiteSquares=[]
//检查是否有赢家

对于(var row=0;row)您是否更改了任何内容?是的。请稍等,让我将其张贴在这里……好了,您现在可以检查它了
setWinnerAndTurn() {
        const history = this.state.history.slice(0, this.state.stepNumber + 1);
        const current = history[this.state.stepNumber];
        const squares = current.squares.slice()

        const blackSquares = []
        const whiteSquares = []
        // Check for a winner
        for (var row=0;row<squares.length;row++) {
            for (var col=0;col<squares[row].length;col++) {
                if (squares[row][col] === 'black') {
                    blackSquares.push([row,col])
                } else if (squares[row][col] === 'white') {
                    whiteSquares.push([row,col])
                }
            }
        }
        
        const valids = this.checkElementsAround(this.checkEmptySpaces())

        // checkEmptySpaces returns all the empty spaces in the game
        // checkElementsAround returns all the objects in all directions if there's initially an element in that direction

        const movesAvailable = [0,0]

        for (var t=0;t<2;t++) {
            const isBlack = (t === 0) ? true : false
            for (var v=0;v<valids.length;v++) {
                const valid = valids[v]
                const turned = this.checkTurningStones(valid.directions,isBlack)
                if (turned.length !== 0) {
                    movesAvailable[t]++;
                }
            }
        }

        if (blackSquares.length + whiteSquares.length === squares.length * squares[0].length || (movesAvailable === [0,0])) {
            // Declare a winner
            if (blackSquares.length !== whiteSquares.length) {
                this.setState({
                    winner: (blackSquares.length > whiteSquares.length) ? 'black' : 'white'
                })
            } else {
                this.setState({
                    winner: 'tie'
                })
            }
        } else {
            // Change turn
            if (movesAvailable[0] === 0) {
                this.setState({
                    blackIsNext: false
                })
            } else if (movesAvailable[1] === 0){
                this.setState({
                    blackIsNext: true
                })
            } else {
                this.setState({
                    blackIsNext: !this.state.blackIsNext
                })
            }
        }
    }

<div className="master-container">
                <GameBoard squares={current.squares} onClick={(row,col) => {
                    const elems = this.checkElementsAround(this.checkEmptySpaces())
                    for (let el=0;el<elems.length;el++) {
                        const turning = this.checkTurningStones(elems[el].directions, this.state.blackIsNext)
                        if (turning.length !== 0) {
                            turning.unshift([row,col])
                            if (row === elems[el].coordinates[0] && col === elems[el].coordinates[1]) {
                                this.handleMove(turning)
                                this.setWinnerAndTurn()
                                // Debug
                                console.log(history.length)
                                break
                            }
                        }                        
                    }
                }}/>

// handleMove -> You give an array of coordinates and it does turn them
// setWinnerAndTurn -> Our function
// checkTurningStones -> I give it the output of checkElementsAround as a parameter, it does return the elements that are to be turned upside down