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