Неявность Next.js next/image «image» имеет тип «любой» – как исправить?
Я новичок в Next.js и TypeScript и не могу найти ресурсы, посвященные решению этой проблемы:
import Image from 'next/image';
export default function Item({ image }) { // <-- parameter image needs a 'type' definition?
...
}
но приведенное выше дает это уведомление/предупреждение/ошибку в отношении параметра image:
Binding element 'image' implicitly has an 'any' type.ts(7031). (parameter) image: any
Пример использования image:
<Image src = {image} alt = {title} fill />
Я понимаю, что TS необходимо определить/объявить типы переменных, но я, черт возьми, понятия не имею, каким должен быть «тип» NextJS Image, и я также знаю, что присвоение ему типа any тоже не лучший вариант? Как я могу решить эту проблему?
Я попробовал следующее, но не работает:
export default function Item({ image: Image }) { // <-- tried the `image: Image` syntax
Есть ли у кого-нибудь какой-либо ресурс, документация или предпочтительное место для поиска правильного типа параметра/функции и правильного синтаксиса, который сопровождает его для подавления этих предупреждений?
Заранее спасибо.
Что такое next/image? Модуль или файл mime-типа image/*?
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 2
по умолчанию в машинописном скрипте, если вы не укажете тип переменной, она будет неявно типизирована влиянием элемента внутри
Если это объект по умолчанию, неявный тип будет anyhttps://www.typescriptlang.org/docs/handbook/type-inference.html
но у вас есть предупреждение из-за noImplicitAny, что по умолчанию верно в tsconfig
https://www.typescriptlang.org/tsconfig/#noImplicitAny
вам необходимо явно указать тип вашего параметра или, если вы действительно хотите, указать его
export default function Item({ image }: {image: Image})
просто будьте осторожны, в вашем случае затронутый тип должен иметь свойство изображения внутри него, чтобы быть действительным
если объект изображения содержит путь к изображению, у вас будет следующее
export default function Item({ image }: {image: string})
Я попробовал ваше предложение, и это, в свою очередь, выдает еще одну ошибку: код: export default function Item({ image }: {image: Image}) ... ошибка: 'Image' refers to a value, but is being used as a type here. Did you mean 'typeof Image'?ts(2749) type Image = /*unresolved*/ any
что присутствует внутри импортированного элемента Image? это тип или непосредственно путь к изображению? если это строка, то в этом случае код станет export default function Item({ image }: {image: string})
спасибо, оно передается на: <Image src = {image} alt = {title} fill /> так что я считаю, что это так string поэтому я изменил на image: string - значит Image сам по себе не имеет типа? думаю, именно поэтому я в замешательстве
отлично, если вы нашли решение, да, это оно;) я обновлю свой ответ, могу ли я попросить вас отметить его, если тема закроется?
Попробуй это:
import Image from 'next/image';
type ItemProps = {
image: Image
};
export default function Item({ image }: ItemProps) {
...
}
спасибо, попробовал ваше предложение, но в строке image: Image появляется ошибка: 'Image' refers to a value, but is being used as a type here. Did you mean 'typeof Image'?ts(2749) type Image = /*unresolved*/ any
Обновите свой вопрос, указав, где вы используете
image