Question

import React, { Fragment } from 'react'

const Ques = (Props:JSX.Element) => {
    return (
        <Fragment>{Props}</Fragment>
    );
}
const ListName = ["Gus","Thekla","Anna","Sophia"].map((Name)=> <div>{Name}</div>)
Ques(ListName)

第Ques(ListName)行我收到此错误。

类型'Element []'的参数不能分配给类型>>的参数 '元件'。类型“ Element []”缺少类型“ Element”中的以下属性：>类型，道具，钥匙

Answer 1

您正在传递JSX.Element数组，

const Ques = (Props:JSX.Element[]) => {
    return (
        <Fragment>{Props}</Fragment>
    );
}
const ListName = ["Gus","Thekla","Anna","Sophia"].map((Name)=> <div>{Name}</div>)
Ques(ListName)

运行此代码时，系统会警告您应为列表项提供密钥。 “键”是特殊的字符串属性，在创建元素列表时需要包括在内。

我会这样写

const Ques = (Props:JSX.Element[]) => {
    return (
        <Fragment>{Props}</Fragment>
    );
}
const ListName = ["Gus","Thekla","Anna","Sophia"].map((Name,nameindex)=> <div key={`${Name}${nameindex/10}`}>{Name}</div>)
Ques(ListName)

您可以在link上了解有关键的信息。

类型'Element []'的参数不能分配给类型'Element'的参数

1 个答案: