1차 프로젝트 path parameter 적용

피드 리스트에서 각 피드 별로 넘어 갈수 있는 path parameter 를 적용해 보았다.

feedList.js

goToFeedDetail = () => {
  this.props.history.push(`/feed/${this.props.id}`);
};

댓글쪽 버튼 클릭 시 goToFeedDetail 이라는 함수를 실행(여기서 중요 한거는 저 함수에 대한 log를 찍었을시 this.props.history.params 에 대한 id가 ${this.props.id}를 찍는다는 것이다)

router.js

<Route exact path="/feed" component={Feed} />
<Route exact path="/feed/:id" component={Feed} />

router.js에 각 피드별 path=/feed/:id 로 각각의 id로 들어갈수 있게 path 를 적어놓았다.

feed.js

componentDidMount() {
fetch(`http://10.58.4.39:8000/feed/${this.props.match.params.id}`)
  .then(res => res.json())
  .then(data => this.setState({ content: data.result }));
  }

개별 feed 에서 fetch 함수로 각 피드별에 id에 대한 데이터만 받아 뿌려주는 방식이다.

path parameter 를 적용 하긴 했지만 지금 설명하려고 보니깐 제대로 이해 못하고 사용한것같다. 이부분에 대해서는 다시 공부하여 제대로 적을수 있도록 해야겠다.