-
질문 & 답변
카테고리
-
세부 분야
프론트엔드
-
해결 여부
미해결
결과값 오류......
20.03.14 22:08 작성 조회수 116
0
안녕하세요 다름이 아니라 강좌를 보고 저 혼자 코딩을 해봤는데 오류가 뜨네요 ㅠㅠ
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<script crossorigin src="https://unpkg.com/react@16/umd/react.development.js"></script>
<script crossorigin src="https://unpkg.com/react-dom@16/umd/react-dom.development.js"></script>
<script src="https://unpkg.com/babel-standalone@6/babel.min.js"></script>
<title>React Web 구구단 구현</title>
</head>
<body>
<div id="root"></div> <!-- 결과 : <div id="root"><button>Like</button></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: '',
};
}
onSubmit = (e) => {
e.preventDefault();
if (parseInt(this.state.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: '',
});
}
render() {
return (
<div>
<div>{this.state.first} 곱하기 {this.state.second}는??</div>
<form onSubmit = {this.onSubmit}
<input type="number" value={this.state.value} onChange={(e) => this.setState({ value: e.target.value })} />
<button>입력!!</button>
</form>
<div>{this.state.result}</div>
</div>
);
}
}
// <input type="number" value={this.state.value} onChange={(e) => this.setState({ value: e.target.value })} />
// input.onchange = (e) => { console.log(e.target.value) }
// input.onchange = function (e) { console.log(e.target.value) }
</script>
<script type="text/babel">
ReactDOM.render(<GuGuDan />, document.querySelector('#root'));
</script>
</body>
</html>
답변을 작성해보세요.
0
답변 1