inflearn logo
강의

Khóa học

Chia sẻ kiến thức

Dự án thực chiến React.js vừa miệng – Phần mạng xã hội (SNS)

(2.6) Shadcn/ui Tóm tắt nội dung cốt lõi 2

shadCn의 popover가 바뀌었는지요? (asChild 관련)

Đã giải quyết

47

jaepang Im

2 câu hỏi đã được viết

0

image.pngimage.png

빨간 줄이 떠서 보니

asChild를 사용 못한다고 합니다.

이게 base-ui로 바뀌어서 그런걸까요??

import { Popover as PopoverPrimitive } from "@base-ui/react/popover"

 

shadcn

Câu trả lời 2

1

winterlood

안녕하세요 jaepang lm님 이정환입니다.

혹시 radix-ui가 아닌 base-ui를 선택해 설치하셨나요? 현재 강의에서는 아래와 같이 radix-ui를 선택하시라고 권장드리고 있는데요

image.png

혹시나 base-ui를 선택하여 실습하고 계신 상황이라면, 아래에 첨부해드린 base-ui의 공식문서를 참고해 사용법을 파악하셔야 합니다.

https://ui.shadcn.com/docs/components/base/popover

직접 확인해보니 base-ui 에서는 asChild Prop이 아닌 render 라는 Prop을 사용하는 것으로 파악됩니다.

image.png

1

jaepang Im

감사합니다.

제가 설치할 때 잘못 보고 설치한 것 같습니다.

radix로 선택 시 잘 작동하는 것 확인했습니다.

-1

communityai8509

안녕하세요, 인프런 AI 인턴입니다. jaepang Im님.

현재 질문에서 Popover 컴포넌트와 관련하여 asChild 속성을 사용하지 못하는 문제에 대해 이야기하셨습니다. @base-ui/react/popover 라이브러리를 사용하고 있는 것 같으며, 이 부분에서 발생한 이슈인 것 같습니다.

문제 요약

  1. TypeScript 에러: PopoverTrigger 컴포넌트에서 asChild prop을 사용할 수 없다는 에러 메시지가 나타나고 있습니다.
  2. 라이브러리 업데이트: @base-ui/react/popover 라이브러리의 업데이트로 인해 asChild 속성이 지원되지 않을 가능성이 있습니다.

가능한 해결 방안

  1. 라이브러리의 문서 확인: 먼저 사용하는 @base-ui/react/popover 라이브러리의 문서를 확인하여 asChild 속성이 지원되는지, 혹은 대체할 수 있는 다른 속성이 제공되는지 체크하세요. 라이브러리 업데이트에 따라 API가 변경될 수 있습니다.

  2. 타입 정의 변화 확인: 라이브러리의 타입 정의 파일 변경 사항을 확인해 보세요. asChild 관련 타입 지원이 중단되었는지 체크해볼 필요가 있습니다.

  3. 대체 접근 방식 시도: 만약 asChild 기능이 중단된 경우, 현재 사용 중인 기능의 대체 구현 방법을 문서에서 제시하고 있는지 확인하세요.

  4. 라이브러리 변경: 만약 위의 방법으로 문제가 해결되지 않는다면, 다른 라이브러리로의 전환도 고려해 볼 수 있습니다.

이와 관련된 유사한 문제를 다룬 기존 답변 링크도 참고하실 수 있습니다:

위 URL에서 유사한 문제에 대한 답을 확인할 수 있을 것입니다.

저는 질문자님의 이해를 돕고자 지식공유자님의 기존 답변을 참고하여 유사한 답변 링크를 추천해드리고 있습니다. 현재 베타 기능으로 답변이 만족스럽지 않을 수 있는 점 양해 부탁드립니다. 🙏 추가적으로 궁금한 점이 있으시면, 이어서 질문해 주세요. 곧 지식공유자께서 답변해 주실 것입니다.

0

jaepang Im

명확한 해결책이 아닙니다.

17강 강의에 목데이터 첨부파일이 없습니다.

2

39

2

제공된 파일을 못 찾고 있어요.

1

42

2

알파벤티지 sleep(5) 관련 문의

1

49

2

PDF 가져오기 오류

1

25

1