초록글강의 보면서 다 따라하면서 배우는 중인데
구구단 만드는건데 나는 화면에 아무것도 안떠 그냥 빈 화면만 나와...
〈!DOCTYPE html>
〈html lang="ko">
〈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>
추천
