react web game : 지뢰 갯수 표시

This commit is contained in:
haerong22
2021-03-23 19:59:48 +09:00
parent 7141285fde
commit a30a666e9e
2 changed files with 29 additions and 2 deletions

View File

@@ -92,6 +92,33 @@ const reducer = (state, action) => {
const tableData = [...state.tableData];
tableData[action.row] = [...state.tableData[action.row]];
tableData[action.row][action.cell] = CODE.OPENED;
let around = []; // 주변 칸의 값을 담을 배열
if (tableData[action.row - 1]) {
// 클릭한 칸의 윗줄이 있을 경우
around = around.concat(
tableData[action.row - 1][action.cell - 1],
tableData[action.row - 1][action.cell],
tableData[action.row - 1][action.cell + 1]
);
}
around = around.concat(
// 클릭한 칸의 좌, 우
tableData[action.row][action.cell - 1],
tableData[action.row][action.cell + 1]
);
if (tableData[action.row + 1]) {
// 클릭한 칸의 아랫줄이 있을 경우
around = around.concat(
tableData[action.row + 1][action.cell - 1],
tableData[action.row + 1][action.cell],
tableData[action.row + 1][action.cell + 1]
);
}
// 선택한 칸의 주변 칸의 갯수
const count = around.filter((v) =>
[CODE.MINE, CODE.FLAG_MINE, CODE.QUESTION_MINE].includes(v)
).length;
tableData[action.row][action.cell] = count;
return {
...state,
tableData,

View File

@@ -55,7 +55,7 @@ const getTdText = (code) => {
case CODE.QUESTION:
return "?";
default:
return "";
return code || "";
}
};
@@ -111,7 +111,7 @@ const Td = ({ rowIndex, cellIndex }) => {
return;
}
},
[tableData[rowIndex][cellIndex]]
[tableData[rowIndex][cellIndex], halted]
);
return (