-
질문 & 답변
카테고리
-
세부 분야
프론트엔드
-
해결 여부
미해결
똑같이 입력했는데 화면에 아무것도 뜨지 않아요.. 제가 어떤 부분을 실수 했을까요?? ㅠㅠ
21.12.17 23:47 작성 조회수 209
0
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>구구단</title>
<script src="https://unpkg.com/react@17/umd/react.development.js" crossorigin></script>
<script src="https://unpkg.com/react-dom@17/umd/react-dom.development.js" crossorigin></script>
<script src="https://unpkg.com/babel-standalone@6/babel.min.js"></script>
</head>
<body>
<div id="root"></div>
<script type="text/babel">
class GuGuDan extends React.component {
constructor(props) {
super(props);
this.state = {
first: Math.ceil(Math.random() * 9),
second: Math.ceil(Math.random() * 9),
value: '',
result: '',
};
}
render() {
return (
<div>
<div>{this.state.first}곱하기{this.state.second}는?</div>
<form onSubmit = {(e) => {
e.preventDefault();
if (parseInt(value)=== this.state.first * this.state.second) {
this.setState({
result: "정답",
first: Math.ceil(Math.random()*9),
second: Math.ceil(Math.random()*9),
value: '',
});
} else{
this.setState({
result: '땡',
value: '',
});
}
}}>
<input type="number" value={this.state.value} onChang= {(e) => this.setState({value: e.target.value})}/>
<button>입력!</button>
</form>
<div>{this.state.result}</div>
</div>
);
}
}
</script>
<script type="text/babel">
ReactDOM.render(<GuGuDan />, document.querySelector('#root'));
</script>
</body>
</html>
답변을 작성해보세요.
답변 1