为什么我无法将此道具传递到组件"不可分配给类型"内部属性"

Question

我想将SavedDocument传递到SavedDocument组件。savedDocuments类型：

type DocumentUploaderFile = {
documentId: string;
id: string;
name: string;
size: number;
status: 'loaded' | 'failed' | 'removing';
}

我收到的错误是：

Type '{ document: DocumentUploaderFile; savedDocuments: DocumentUploaderFile[]; }' is not assignable to type 'IntrinsicAttributes & { document: DocumentUploaderFile; }'.
Property 'savedDocuments' does not exist on type 'IntrinsicAttributes & { document: DocumentUploaderFile; }'.

这是我的组件，我正试图从传递道具

const AdditionalDocumentationList = ({ savedDocuments }: { savedDocuments: DocumentUploaderFile[] }) => {
const renderDocuments = (savedDocuments: DocumentUploaderFile[]) => {
return savedDocuments.map((document: DocumentUploaderFile) => {
return <SavedDocument document={document} savedDocuments={savedDocuments} />
})
}
return <AdditionalDocumentationWrapper>{renderDocuments(savedDocuments)}</AdditionalDocumentationWrapper>
}

我想传递这个数组，这样我就可以在SavedDocument组件中单击DeleteIconSmall时更新它，它将从SavedDocument数组中删除匹配的id。

这是我试图将道具传递到的子组件：

const SavedDocument = (
{ document }: { document: DocumentUploaderFile },
{ savedDocuments }: { savedDocuments: DocumentUploaderFile[] }
) => {
return (
<SavedDocumentWrapper>
<StepCompleteIconSmall />
<SavedDocumentName>{document.name}</SavedDocumentName>
<DeleteIconSmall />
</SavedDocumentWrapper>
)
}

Answer 1

您在SavedDocument组件上以错误的方式传递道具应该是这样的

const SavedDocument = (
{ document, savedDocuments }: { document: DocumentUploaderFile, savedDocuments: DocumentUploaderFile[] }
) => {
return (
<SavedDocumentWrapper>
<StepCompleteIconSmall />
<SavedDocumentName>{document.name}</SavedDocumentName>
<DeleteIconSmall />
</SavedDocumentWrapper>
)
}