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

강의 수강하면서 궁금한 점이 생겨서 질문 드립니다.

const TodoItem = ({ id, isDone, content, date }) => {
    return (
        <div className="TodoItem">
            <input readOnly checked={isDone} type="checkbox" />
            <div className="content">{content}</div>
            <div className="date">{new Date(date).toLocaleDateString()}</div>
            <button>delete</button>
        </div>
    );
};

TodoItem.jsx에서 구조분해 할당으로 todo를 받아

• id

• isDone

• content

• date

를 가져와서 렌더링 하고 있는데 실제로 id값은 코드에서 사용되지 않고 있습니다.

저희는 eslint.config.js에서 'no-unused-vars' : off로 설정해 두었기 때문에 에러는 나지 않지만 만약 현업에서 이런 상황이라면 사용하지 않는 id 변수는 어떻게 처리하는지 궁금합니다.

찾아본 결과

1. 언더스코어 사용

const TodoItem = ({ _id, isDone, content, date }) => {

2. rest 사용

    

const TodoItem = ({ isDone, content, date, ...rest }) => {

이런 방식들이 있는데 강사님은 어떤 방식을 사용하시는지 어떤식으로 처리하시는지 궁금합니다.

감사합니다.