• 카테고리

    질문 & 답변

  • 세부 분야

    풀스택

  • 해결 여부

    미해결

질문이요

19.09.30 12:35 작성 조회수 371

0

댓글 달때요, 

게시글에있는 댓글 버튼을 클릭하면, 댓글창이 생기잖아요.

댓글버튼을 클릭함과 동시에,  warning 이 뜨네요 ..

react-dom.development.js:11494 Warning: componentWillReceiveProps has been renamed, and is not recommended for use. See https://fb.me/react-async-component-lifecycle-hooks for details.

* Move data fetching code or side effects to componentDidUpdate.

* If you're updating state whenever props change, refactor your code to use memoization techniques or move it to static getDerivedStateFromProps. Learn more at: https://fb.me/react-derived-state

* Rename componentWillReceiveProps to UNSAFE_componentWillReceiveProps to suppress this warning in non-strict mode. In React 17.x, only the UNSAFE_ name will work. To rename all deprecated lifecycles to their new names, you can run `npx react-codemod rename-unsafe-lifecycles` in your project source folder.

Please update the following components: Animate

이라는 warning 인데요.. 

제가 코드 하나하나 체크하면서 봤는데요.

뜨는곳이, 

component/PostCard.js 

const PostCard = ({ post }) => {
...
  return (
    <>
....
    {commentFormOpened && (
        <>
         <Form onSubmit={onSubmitComment}>
            <Form.Item> // <- 이 부분에서 뜨는데요
              <Input.TextArea rows={4} value={commentText} onChange={onChangeCommentText} />
            </Form.Item> // <- 이 부분에서 뜨는데요
            <Button type="primary" htmlType="submit" loading={isAddingComment}>삐약</Button>
          </Form>
          <List
            header={`${post.Comments ? post.Comments.length : 0} 댓글`} 
            dataSource={post.Comments || []}
            renderItem={item => ( 
              <li>
                <Comment
                  author={item.User.nickname}
                  avatar={<Avatar>{item.User.nickname[0]}</Avatar>}
                  content={item.content}
    
                />
              </li>
            )}
          /> */}
        </>
      )}

</>

  );
};
...

  <Form.Item>을 안 쓰면,  저런 warning 이 안뜨는데, 

정확한 이유를 모르겠네요...

혹시 아시나요 ? ??

course-thumbnail

React로 NodeBird SNS 만들기

4-16. 댓글 작성 리덕스 사이클

강의실 바로가기

답변 1

답변을 작성해보세요.

0

조현영님의 프로필

조현영

지식공유자

2019.09.30

이 부분은 antd의 Form.Item 내부 구현이 옛날 라이프사이클을 써서 그렇습니다. 다음 버전이 나오면 수정될 것입니다.

이 글과 비슷한 Q&A