19.08.23.금 - TIL

• 오늘 Nomad Coder에서 React 강의를 봤다. 보면서 영화 정보 웹을 clone coding했다. axios를 이용해서 영화 정보를 가지고 있는 api에 get 요청을 보내서 응답으로 영화 리스트를 받았다. 영화 리스트에서 id, genre, title, summary, rating, year 정보를 가져왔다. 처음에 조건없이 정보를 가져왔는데, api 사용법에 rating 내림차순으로 가져올 수 있었다. 정렬이된 상태로 리스트를 가져와서 웹상으로 뿌렸다.
  state의 data를 직접 변경하지 않고 state의 변화를 줘야했다. 그래서 예전에는

//...//
class App extends React.Component {
    state = {
      count: 0;
  	}
	//...//
    add = () => {
      const { count } = this.state;
      count++
      this.setState({
          count
      }) 
    }
    //...//
}

add 함수에서 this.setState부분에서 객체를 매개변수로 이용해서 변경을 했었는데 매개변수로 함수를 이용해서 변경할 수 있었다.

 this.setState(current => ({
 	count: current.count + 1;
 	})
 ); 

current는 현재의 상태의 state를 가리킨다. 좀 더 활용할 수 있는 방법을 찾아야겠다.