옛날 react 문법
|
class Profile extends React.Component {
constructor() {
super();
this.state = {name:'Kim', age:30}
}
changeName() {
this.setState( {name:'예전 리액트는 React의 setState 함수를 사용한다'})
}
render() {
return(
<div>
<h3>프로필입니다</h3>
<p>저는 {this.state.name} </p>
<button onClick={
() =>
{
this.changeName()
}
}>변경합니다</button>
</div>
)
}
}
|
class = 변수와 함수를 보관하는 덩어리
React.Component를 상속받아 class를 만든다.
constructor는 class의 변수와 초기값을 저장할 때 사용하는데, 예시로 state는 constructor 안에 작성한다.
state를 꺼내 쓰려면 this.state.state명을 사용한다.
class에서 함수를 만들려면 함수이름(매개변수) { 내용 } 으로 작성하면 되는데, .
bind(this) 를 사용해야 하는 오류가 날 수도 있으므로 함수이름 = () => { } 형식으로 사용하는 것이 편하다.
지금 기준 신문법인 useState는 React Hook이라고 부르는데, 기존 Class 바탕의 코드를 작성할 필요 없이 코드를 작성할 수 있도록 만든 문법을 말한다.
공식 문서 : https://ko.reactjs.org/docs/hooks-intro.html
'REACT' 카테고리의 다른 글
| React 실습한 사이트 (0) | 2022.07.04 |
|---|