Showing
2 changed files
with
12 additions
and
6 deletions
... | @@ -4,7 +4,7 @@ import SocketContext from '../../contexts/SocketContext'; | ... | @@ -4,7 +4,7 @@ import SocketContext from '../../contexts/SocketContext'; |
4 | import { MessageType, RawMessage } from '../common/types'; | 4 | import { MessageType, RawMessage } from '../common/types'; |
5 | import { Canvas } from './Canvas'; | 5 | import { Canvas } from './Canvas'; |
6 | import { RoundInfo } from './RoundInfo'; | 6 | import { RoundInfo } from './RoundInfo'; |
7 | -import { Role, RoundData } from './types'; | 7 | +import { RoundData } from './types'; |
8 | import { Word } from './Word'; | 8 | import { Word } from './Word'; |
9 | 9 | ||
10 | interface GameBoardLocation { | 10 | interface GameBoardLocation { |
... | @@ -37,8 +37,8 @@ export const GameBoard: React.FC<GameBoardProps> = ({ isInGame }) => { | ... | @@ -37,8 +37,8 @@ export const GameBoard: React.FC<GameBoardProps> = ({ isInGame }) => { |
37 | setWords([]); | 37 | setWords([]); |
38 | 38 | ||
39 | const data = rawMessage.message as RoundData; | 39 | const data = rawMessage.message as RoundData; |
40 | - console.log('테스트 location ', location.state.username); | 40 | + // console.log(location.state.username); |
41 | - console.log('테스트 rolse ', data.roles); | 41 | + // console.log(data.roles); |
42 | const index = data.roles.findIndex(x => x.username === location.state.username); | 42 | const index = data.roles.findIndex(x => x.username === location.state.username); |
43 | setIsDrawer(data.roles[index].role === 'drawer'); | 43 | setIsDrawer(data.roles[index].role === 'drawer'); |
44 | setWordChosen(''); | 44 | setWordChosen(''); |
... | @@ -64,18 +64,24 @@ export const GameBoard: React.FC<GameBoardProps> = ({ isInGame }) => { | ... | @@ -64,18 +64,24 @@ export const GameBoard: React.FC<GameBoardProps> = ({ isInGame }) => { |
64 | 64 | ||
65 | useEffect(() => { | 65 | useEffect(() => { |
66 | socket.on('msg', handleStart); | 66 | socket.on('msg', handleStart); |
67 | - socket.on('msg', handleGetWordLength); | ||
68 | socket.on('msg', handleWordSet); | 67 | socket.on('msg', handleWordSet); |
69 | socket.on('msg', handleAnswer); | 68 | socket.on('msg', handleAnswer); |
70 | 69 | ||
71 | return () => { | 70 | return () => { |
72 | socket.off('msg', handleStart); | 71 | socket.off('msg', handleStart); |
73 | - socket.off('msg', handleGetWordLength); | ||
74 | socket.off('msg', handleWordSet); | 72 | socket.off('msg', handleWordSet); |
75 | socket.off('msg', handleAnswer); | 73 | socket.off('msg', handleAnswer); |
76 | } | 74 | } |
77 | }, []); | 75 | }, []); |
78 | 76 | ||
77 | + useEffect(() => { | ||
78 | + socket.on('msg', handleGetWordLength); | ||
79 | + | ||
80 | + return () => { | ||
81 | + socket.off('msg', handleGetWordLength); | ||
82 | + } | ||
83 | + }, [wordChosen]); | ||
84 | + | ||
79 | return ( | 85 | return ( |
80 | <div className={`w-auto ${isInGame ? '' : 'hidden'}`}> | 86 | <div className={`w-auto ${isInGame ? '' : 'hidden'}`}> |
81 | <div className='w-full flex flex-col justify-center items-center'> | 87 | <div className='w-full flex flex-col justify-center items-center'> | ... | ... |
... | @@ -28,7 +28,7 @@ export const Ready: React.FC<ReadyProps> = ({ users }) => { | ... | @@ -28,7 +28,7 @@ export const Ready: React.FC<ReadyProps> = ({ users }) => { |
28 | var test = users.length > 1; | 28 | var test = users.length > 1; |
29 | users.forEach(x => test = test && (x.ready || x.admin)); | 29 | users.forEach(x => test = test && (x.ready || x.admin)); |
30 | setIsAllReady(test); | 30 | setIsAllReady(test); |
31 | - }); | 31 | + }, [users, location.state.username]); |
32 | 32 | ||
33 | const handleReady = useCallback(() => { | 33 | const handleReady = useCallback(() => { |
34 | if (isAdmin && isAllReady) { | 34 | if (isAdmin && isAllReady) { | ... | ... |
-
Please register or login to post a comment