next.js 如何解决“属性...在类型'IntrinsicAttributes & ...'上不存在”

gzszwxb4 于 2022-11-05 发布在其他

关注(0)|答案(2)|浏览(529)

在我的nextjs-app中，我有Navbar-组件，在这里我把菜单项作为一个道具传递：

<Navbar navitems={navigationItems} />

navigationItems是一个对象数组。
那么在Navbar-分量中我有这样的：

export interface INavBarItem {
   id: string;
   text: string;
   path: {
     slug: string;
   };
}

export type INavBar = INavBarItem[];

const Navbar: React.FC<INavBar> = ({ navitems }) => { ... }

现在我得到错误Type error: Type '{ navitems: any; }' is not assignable to type 'IntrinsicAttributes & INavBar'.Property 'navitems' does not exist on type 'IntrinsicAttributes & INavBar'.
我做错了什么？

next.js

来源：https://stackoverflow.com/questions/74193442/nextjs-how-to-solve-property-does-not-exist-on-type-intrinsicattributes

2条答案

按热度按时间

h79rfbju1#

export interface INavBarItem {
   id: string;
   text: string;
   path: {
     slug: string;
   };
}

export type INavBar = INavBarItem[];

type Props = {
  navitems: INavBar;
}

const Navbar: React.FC<Props> = ({ navitems }) => { ... }

赞(0）回复(0）举报 2022-11-05

2g32fytz2#

这是打字脚本，因此您需要显式键入您的道具。

import * as React from 'react';

export interface INavBarItem {
  id: string;
  text: string;
  path: {
    slug: string;
  };
}

export type INavBar = INavBarItem[];

const Navbar: React.FC<INavBar> = (navItems : INavBarItem[]) => {

  return (
    <div></div>
  )

}

无法从INavBar反结构化导航项，因为它不是INavBar的属性。如果要反结构化道具，则需要使用道具类型中存在的属性的名称。
但错误在于，您不能将any类型作为props传递给组件。

赞(0）回复(0）举报 2022-11-05

我来回答

next.js 如何解决“属性...在类型'IntrinsicAttributes & ...'上不存在”

2条答案

相关问题

热门标签

最新问答