Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

195
Views
Why is originalBoard being updated also?

I'm making a sudoku game and have a variable for the board at the moment and the original board. When the user inputs a number the board is updated but for some reason the originalBoard variable is also. I only change the value of board so I'm not sure why originalBoard is also updated.

input code:

export default function Block(props) {
let { boxNumber, blockNumber } = props
const { board, originalBoardSlots, isSolved } = useBoard()
const dispatch = useDispatch()
const number = board[boxNumber][blockNumber]
let numberInput;
let border = ""

if(blockNumber === 2 || blockNumber === 5)
    border += " b-right"
if(boxNumber === 2 || boxNumber === 5)
    border += " b-bottom"

if(originalBoardSlots[boxNumber][blockNumber]){
    numberInput = (
        <input 
            type="number"
            className={'number og-number' + border}
            value={number}
            min="0"
            max="9"
            disabled
        />
    )
}else {
    numberInput = (
        <input 
            type="number"
            className={'number non-og-number' + border}
            value={number !== 0 ? number : ""} 
            min="0"
            max="9"
            onChange={(e) => handleChange(e)}
            disabled={isSolved}
        />
    )
}

const handleChange = (e) => {
    const newNumber = e.target.value === "" ? 0 : parseInt(e.target.value)
    if(newNumber <= 9 && newNumber >= 0){
        dispatch({
            type: "set-number-slot",
            payload: {
                boxNumber: boxNumber,
                blockNumber: blockNumber,
                number: newNumber
            }
        })
    }
}

return (
    numberInput
)}

reducer code:

case "set-number-slot":
        const { boxNumber, blockNumber, number } = action.payload
        state.board[boxNumber][blockNumber] = number
        const newBoard = state.board
        return {
            ...state,
            board: newBoard
        }

function for setting variables originally:

export default async function getBoard(){
const response = await fetch("https://sugoku.herokuapp.com/board?difficulty=easy");
const data = await response.json();
const board = await data.board
const originalBoardSlots = await board.map(box => {
    return box.map(block => block !== 0)
})
const state = {
    board: board, 
    originalBoard: board,
    originalBoardSlots: originalBoardSlots
}
return state}
about 4 years ago · Juan Pablo Isaza
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!