Trò chơi tic-tac-toe javascript github
2. Thực hiện. một. Hiển thị bảng chơi TicTacToe Bài toán của chúng ta sẽ sử dụng ma trận 3x3 như trong ví dụ của ReactJS. Chúng ta sẽ bắt đầu từ Game -> gọi đến Board và Board sẽ gọi 9 ô vuông -> Mỗi Square sẽ trả lại một ô vuông. Do đó, cần phải viết phương thức gọi Square cho Board và một vòng lặp để gọi 9 ô Square thay vì gọi 9 lần (Sẽ đề cập sau)
0
1Kết quả như sau. Tuy nhiên, trong bài toán này chỉ là ma trận 3x3, nếu yêu cầu bài toán là ma trận 10x10 hoặc 100x100 thì cuộc gọi Square thủ công sẽ không hay. Do đó ta cần có vòng lặp để gọi Square theo kích thước của ma trận.
2
3
4
5Đến đây chúng ta đã hoàn thành phần hiển thị bảng TicTacToe rồi. b. Cho phép người dùng chơi và tính toán người chiến thắng Về phần thuật toán để tính toán người chiến thắng thì chúng ta sẽ sử dụng luôn thuật toán của ReactJS trong phần hướng dẫn. Đầu tiên, ta tạo sự kiện cho mỗi ô vuông trong bảng bằng cách.
6
5
8Lúc này, ta thử click vào một ô bất kỳ trên màn hình và thấy handleClick in class Trò chơi đã hoạt động. V Việc tiếp theo của chúng ta là cho người dùng 'X' và 'O' tương ứng với trò chơi, ở đây giả sử người chơi 'X' bắt đầu trước
9Kết quả như sau. Bây giờ chúng ta sẽ bổ sung thêm phần thuật toán tính toán người chiến thắng (lấy hướng dẫn của ReactJS), với các nhiệm vụ sau.
00
01
02Đến đây ta đã hoàn thành mục đích cho phép Người dùng chơi và tính toán người chiến thắng và người hòa rồi. Như vậy từ đầu đến giờ chúng ta đã thành công trong.
Các chức năng còn lại sẽ được cập nhật ở phần 2 (https. //viblo. asia/p/nhap-mon-react-voi-tictactoe-phan-2-Do754N34ZM6), xin cảm ơn các bạn đã theo dõi |