인프런 커뮤니티 질문&답변

안녕하세요. 강의 재밌게 잘 듣고 있습니다.

강의를 듣다 궁금증이 생겨 질문 남깁니다. 

store.getKeywordList() 메서드를 사용해서 keywordList를 storage에서 가져오는 작업을

componentDidMount에서 하셨는데,

main.js의 search 메서드에서 submit이 발생했을 때, store에서 searchResult를 가져오는 것처럼

keyword tab을 클릭했을 때 keywordList를 가져오는 방식으로 작성하지 않고 componentDidMount를 사용하신 이유가 궁금합니다.

아래와 같이 onClick과 핸들러를 사용하여 작성해도 정상적으로 동작하는 것처럼 보이는 것을 확인했습니다.

  handleTabClick(tabType) {
    if (tabType == TabType.KEYWORD) {
      const keywordList = store.getKeywordList();
      this.setState({ keywordList });
    }
  }

...

    const tabs = (
      <>
        <ul className="tabs">
          {Object.values(TabType).map((tabType) => {
            return (
              <li
                className={tabType === this.state.selectedTab ? "active" : ""}
                key={tabType}
                onClick={() => { this.setState({ selectedTab: tabType })
                                  handleTabClick(tabType)}}
              >
                {TabLabel[tabType]}
              </li>
            );
          })}
        </ul>
        {this.state.selectedTab === TabType.KEYWORD && keywordList}
        {this.state.selectedTab === TabType.HISTORY && historyList}
      </>
    );