打字稿无状态(功能)组件警告使用析构?

Question

我在尝试执行时出错

import * as React from "react";
import { render } from "react-dom";
import "./styles.css";
const Person: React.FC = ({ name }) => <div>{name}</div>;
function App() {
return (
<div className="App">
<Person name="james" />
</div>
);
}
const rootElement = document.getElementById("root");
render(<App />, rootElement);

4号线有什么问题？

https://codesandbox.io/s/cocky-silence-wxs2s

Answer 1

你的问题不是解构，而是你必须为组件的 props 提供一个类型定义。一种方法是创建一个Props类型并将其作为泛型传递给React.FC：

type Props = {
name: string;
};
const Person: React.FC<Props> = ({ name }) => <div>{name}</div>;