Question

我在尝试让 Typescript 处理传递道具时遇到了一些困难。这是我的代码：

App.tsx

export const ProductPage = (): JSX.Element => {
  const { id } = useParams<{ id: string }>();

  return (
    <UpdateProductPage id={id} /> //throws an error here for id
  )
}

更新ProductPage.tsx

interface PropType {
  id: string;
}

export const UpdateProductPage = ({ id }: PropType): JSX.Element => {
  console.log(id)
  //unrelated logic
}

所以基本上在控制台中，我收到一条错误消息：

Type '{ accessToken: string; }' is not assignable to type 'IntrinsicAttributes'.
  Property 'accessToken' does not exist on type 'IntrinsicAttributes'.ts(2322)

我也尝试通过执行 UpdateProductPage: React.FC<PropType> 来声明道具类型，但它仍然不起作用。

Answer 1

试试这个方法：

更新ProductPage.tsx

import { FC } from 'react';

interface PropType {
  id: string;
}

export const UpdateProductPage: FC<PropType> = ({ id }): JSX.Element => {
  console.log(id)
}

或更改界面以使用类型。

type PropType = {
  id: string;
}

补充：https://fettblog.eu/typescript-react-why-i-dont-use-react-fc/

打字稿/反应传递道具错误“不存在于类型...”

1 个答案: