尝试将[Props]更改为Props，如下所示

const Login: FC<Props> = ({ authors }) => { ... }

现在它可以工作了，因为它期望的是对象而不是数组，我们将传递一个像<Login authors={authors} />这样的对象。现在authors将是一个对象数组。

你可以使用type或interface来描述 prop 。通常用interface来描述objects。interfaces以字母I开始，types以T开始，这也是一个很好的约定。

interface IAuthor {
  name: string;
  password: string;
}

const Login = ({ authors }: { authors: IAuthor[] ): JSX.Element => {
  return (
    ...
  )
}

在上面的示例中，Login组件期望一个prop authors，它是IAuthor e描述的objects数组。g的。

authors = [
  {
    name: "Spiderman"
    password: "maryjane"
  },
  { 
    name: "Superman"
    password: "loislane"
  }
]

希望这能帮上忙。

type Props = {
          authors: {
            name: string;
            password: string;
          }[];
        };
        
        const Login: FC<Props> = ({ authors }) => {
          const history = useHistory();
          const [name, setName] = useState<IUser["name"]>("");
          const [password, setPassword] = useState<IUser["password"]>("");
    
    
    please use these syntaxes to fix the error. There are three errors in your code that I found.

FC<Props>
<IUser["name"]>
<IUser["password"]>

您定义了IUser接口并定义了名称、密码状态以及IUser类型，这将导致问题，因为当您定义以下内容时：

const [name, setName] = useState<IUser>("");
// name will expected to be 
name = {
    name: 'name',
    password: 'password'
}

这是错误的，因为name，password是一个字符串，所以试着这样定义它：

const [name, setName] = useState<IUser["name"]>("");
const [password, setPassword] = useState<IUser["password"]>("");

然后你必须修复向FC组件传递作者的问题：

const Login: FC<Props> // instead of <[Props]>

最后一件事，你必须修复这个类型，以匹配你从应用程序传递给它的数据类型。tsx：

type Props = {
    authors: {
       author_name: string; // instead of name
       password: string;
    }[];
};

// because you are passing and comparing here with author_name not with name

const userData = authors.find(
  (user) => user.author_name === name && user.password === password
);

然后你从应用程序中传递它，就像这样：

const Authors = [
   {
      id: "001",
      author_name: "John Smith", // not a name
      password: "123"
   }
 ];