자바스크립트 find 사용했다가 리턴 타입때문에 .some 변경

intellyj에서 

오류 내용을 보면 

ai로 번역하면

 

"TS2322: AllergyItem 타입 또는 undefined 타입은 boolean 타입에 할당할 수 없습니다. undefined 타입은 boolean 타입에 할당할 수 없습니다. Type01Button.tsx(6, 5): 예상되는 타입은 속성 'isSelected'에서 선언되었으며 여기에 IntrinsicAttributes 및 Props 타입이 있습니다."
즉, 'isSelected' 속성은 boolean 타입이어야 하지만, 현재 AllergyItem 타입 또는 undefined 타입이 할당되었습니다. 따라서 이는 타입 불일치 오류를 발생시킵니다.
이 문제를 해결하려면 'isSelected' 속성에 boolean 값을 할당해야 합니다. 이전에 제시했던 코드 수정 제안이 이 오류를 해결할 것이며, Array#some 메소드는 boolean 값을 반환합니다. 그러므로 이를 사용하면 현재의 타입 오류를 해결할 수 있습니다

 

ai에서 개선 코드는 다음과 같습니다.

(item: MenuItem, index: number) => {
    return item && (
        <Type01Button
            key={index}
            text={item.name}
            isSelected={menu.allergyCheckId.some(aitem => aitem.id === item.id)}
            id={item.id}
            onClick={clickMenuButton}
            buttonCode='allergy'
        />
    );
};

 

상기 코드는 다음과 같은 변경을 포함하고 있습니다:
find 대신 some 메소드를 사용하였습니다. some 메소드는 주어진 predicate 함수를 만족하는 요소가 배열에 존재하는지 확인합니다. 이것은 우리가 원하는 동작입니다.
지나치게 복잡한 삼항연산자를 간단히 하였습니다.
코드의 가독성을 높이기 위해 각 props를 새로운 줄에 작성하였습니다.

 

타입문제가 생겨서 추가적으로 수정

isSelected={menu.allergyCheckId.some((aitem:MenuItem) => aitem.id === item.id)}