inflearn logo
강의

Khóa học

Chia sẻ kiến thức

Học React bằng cách tạo trò chơi trên web

5-2. Liên kết setInterval và vòng đời

이미지 div 부분의 style 템플릿 리터럴 부분이 적용이 되지 않습니다.

313

Na Seunghoo

7 câu hỏi đã được viết

0

render() {
        const {result, score, imgCoord} = this.state;
        return (
            <>
                {imgCoord}
                <div id="computer" style={{ background : `url('https://en.pimg.jp/023/182/267/1/23182267.jpg') ${imgCoord} 0` }}/>
                <div>
                    <button id="rock" className="btn" onClick={() => this.onClick('바위')}>바위</button>
                    <button id="scissor" className="btn" onClick={() => this.onClick('가위')}>가위</button>
                    <button id="paper" className="btn" onClick={() => this.onClick('보')}>보</button>
                </div>
                <div>결과 {result}</div>
                <div>현재 {score}</div>
            </>
        );
    }

1. 선생님 방식대로 따라했으나 이미지가 변경되지 않습니다. 

{imgCoord}를 별도로 꺼내서 찍어보면 변경이 되는데 

<div id ="computer" 의 `${imgCoord}`여기에 넣을 경 해당 태그의 속성에서는 값이 변경이 되지 않습니다 .왜그럴까요 ? 

템플릿리터럴 react

Câu trả lời 2

1

spy03128

class RSP extends Component {
state = {
result: "",
imgCoord: rspCoords.바위,
score: 0,
};

저는 state 부분에서 imgCoord 값을 0으로 안하고 rspCoords.바위로 설정해주니까 동작하더라구요 !

0

o6o40777

이거 때문에 한참 헤맸는데 감사합니다 ㅠㅠ

0

zerocho

위에 {imgCoord}가 바뀌고 있다면 아래 background도 같이 바뀌고 있을 겁니다. imgCoord가 0 -142px -284px 처럼 px까지 붙어서 바뀌고 있는게 맞나요?

npm run dev 실행 시 포트가 안뜨는 문제

0

211

2

timeouts.current를 useEffect 의 input값으로 넣었을때

0

89

2

렌더링 테스트 코드 (Hooks)

0

81

1

Cannot find package 'react-refesh' 이런 에러 뜨시는 분들 보세요.

0

154

1

해당 에러 뜨는 분들 보세요. "Uncaught TypeError: ReactDom.createRoot is not a function"

1

193

1

강사님 레포지토리에서 코드 복사 시 master 브랜치 말고 react18 브랜치꺼 복붙하세요ㅠㅠ

0

99

1

useMemo와 useCallback 사용 시기

0

209

2

onRightClickTd가 작동을 하지 않습니다.

0

228

1

action.type 불러오는 방식

0

222

2

onClickRedo 질문

0

172

1

const Try = require(./Try) 빨간줄

0

249

1

npx webpack 실행시

0

316

1

지뢰찾기 강좌에서 빈칸들 한번에 열기 파트에서 여쭤보고싶은부분이 있어서 글 올립니다.

0

236

1

강좌에서 다루지 않은 기능들은 어떻게 학습하면 좋을까요?

0

311

1

react devtool이 enable 않됩니다.

0

532

2

React 랜더링이 되지 않습니다.

0

414

2

비동기로 동작하는 setState에 대해서

0

332

1

npm run dev 할 때 에러발생

0

480

2

memo, PureComponenet, shouldComponentUpdate 관련 질문

0

207

1

devMiddleware의 필요성

0

354

1

리액트에서 화살표 함수를 사용해야하는 이유

0

937

2

path.join관련질문

0

283

2

2-9. 웹팩 데브 서버와 핫 리로딩 설치과정 시 에러

0

377

1

next.js 에서 이와 비슷한 예제를 돌리고있는데 react랑 달라서 질문 드립니

1

494

4