Tôi khá mới với TS và muốn hiểu tại sao tôi gặp lỗi kiểu trong đoạn mã sau (đã được đơn giản hóa):
Tôi mới làm quen với TS và tôi muốn biết lý do tại sao tôi gặp phải lỗi loại trong đoạn mã sau (được đơn giản hóa):
"sử dụng máy khách";
nhập { ArrowDownWideNarrow, Cài đặt } từ "lucide-react";
giao diện LinkItemProps {
tên: chuỗi;
}
const biểu tượngBản đồ = {
Thể loại: ,
Quản trị viên: ,
};
xuất const LinkItem = ({ name }: LinkItemProps) => {
{iconMap[tên]}
}
Lỗi nằm ở `{iconMap[name]}:
Lỗi nằm ở `{iconMap[name]}:
"Phần tử ngầm có kiểu 'bất kỳ' vì biểu thức kiểu 'chuỗi' không thể được sử dụng để lập chỉ mục cho kiểu '{ Categories: Phần tử; Admin: Phần tử; }'.
"Phần tử ngầm có loại 'bất kỳ' vì không thể sử dụng biểu thức của loại 'chuỗi' trên loại chỉ mục '{Danh mục:Phần tử; Quản trị viên:Phần tử;}".
Không tìm thấy chữ ký chỉ mục nào có tham số kiểu 'chuỗi' trên kiểu '{ Categories: Element; Admin: Element; }'."
Không tìm thấy chữ ký chỉ mục với loại tham số 'STRING' trên loại '{Categories:Element;Admin:Element;}'. "
Các phần tử cha
có những điều sau đây:
Phần tử cha có nội dung sau:
liên kết const = [
{
href: "/quản trị",
tên: "Quản trị viên",
id: "quản trị viên",
},
{
href: "/thể loại",
tên: "Thể loại",
id: "các danh mục",
},
];
xuất khẩu const Thanh bên = async () => {
trở lại (
{LINKS.map((liên kết) => (
))}
)
}
Thêm câu trả lời
Bạn có thể thu hẹp loại tên
với giao diện LinkItemProps { tên: keyof typeof iconMap }
để làm cho nó hoạt động.
Bạn có thể thu hẹp loại tên bằng cách sử dụng giao diện LinkItemProps{name:keyof typeof iconMap} để làm cho nó hoạt động.
Khuyến nghị câu trả lời tuyệt vời
Không tìm thấy chữ ký chỉ mục nào có tham số kiểu 'chuỗi' trên kiểu '{ Categories: Element; Admin: Element; }'."
Các sợi dây
loại là quá rộng, bạn có thể cụ thể hơn về tên
loại prop để nó kế thừa đúng các trường dựa trên Biểu tượngBản đồ
sự vật.
Loại chuỗi quá rộng, bạn có thể cụ thể hơn với loại prop tên để nó kế thừa chính xác các trường dựa trên đối tượng bản đồ biểu tượng.
Bản demo Typescript
Bản demo bản đánh máy
giao diện LinkItemProps {
tên: keyof typeof iconMap;
}
hoặc một cách tiếp cận thủ công, được gõ chặt chẽ:
Hoặc một cách tiếp cận thủ công, gõ đúng:
giao diện LinkItemProps {
tên: 'Thể loại' | 'Quản trị';
}
Bản demo TypeScript được cập nhật
Bản demo gõ được cập nhật
Thêm câu trả lời
Cảm ơn bạn rất nhiều, người dùng tốt bụng ;) Nhưng bây giờ tôi có lỗi trong phần tử cha (tôi đã chỉnh sửa câu hỏi của mình để bao gồm phần tử cha). Lỗi hiện ở đó với nội dung: "Kiểu 'string' không thể gán cho kiểu '"Categories" | "Admin"'." Thuộc tính đó nằm trong thuộc tính "name" trong LinkItem bên trong bản đồ
. Cảm ơn bạn, tôi hiểu câu hỏi của tôi có lẽ khá cơ bản :)
Cảm ơn rất nhiều, người dùng tốt bụng;) Nhưng bây giờ tôi gặp lỗi trong phần tử gốc (tôi đã chỉnh sửa câu hỏi của mình để bao gồm phần tử gốc). Lỗi tôi nhận được bây giờ là: "Không thể gán 'Chuỗi' cho loại '"Danh mục"|"Quản trị viên"". "Nó nằm trong"tên"thuộc tính của LinkItem bên trong bản đồ. Cảm ơn, tôi hiểu rằng câu hỏi của tôi phải rất cơ bản :)
@GuillermoBrachetta Kiểm tra "Bản demo TypeScript đã cập nhật" của tôi
@GuillermoBrachetta Hãy xem "Đang cập nhật bản trình diễn bản mô tả" của tôi
Quả thực đã xóa hết lỗi rồi, cảm ơn bạn! Giờ mình sẽ cố gắng tiêu hóa nó :D
Điều này đã làm sáng tỏ tất cả các lỗi, cảm ơn bạn! Bây giờ tôi cố gắng tiêu hóa nó: D
Tôi là một lập trình viên xuất sắc, rất giỏi!