javascript - 如何将多个 Prop 传递给 React.createElement 创建的元素？

Question

React.createElement( type, [props], [...children] )

正如 react 文档所说。但不知何故，它对我有多个 Prop 不起作用。我试图传递一组键值对象，传递一个带有键值的容器对象，但没有任何效果。让我展示一下我是如何尝试的:

//input.js
const Input = ({name, elementProps}) => {
    const { element, props } = elementProps;
    return React.createElement(element, props)
}

export default Input;
//props from
{
    name: "msg",
    element: "textarea",
    props: [
        {placeholder: "Message"},
        {rows: "4"},
        {cols: "50"},
    ]
}
//rendered by method
const { name, ...elementProps } = objectAbove;
return <Input name={name} elementProps={elementProps} />

传递多个属性所需的语法是什么？

Answer 1

props 应该是非数组对象，而不是数组。您正在创建的 props 数组看起来很容易是单个对象而不是对象数组。而不是:

props: [
    {placeholder: "Message"},
    {rows: "4"},
    {cols: "50"},
]

也许

props: {
    placeholder: "Message",
    rows: "4",
    cols: "50"
}

作为Tholle在 a comment 中指出，the documentation 中语法中显示的 [] :

React.createElement( type, [props], [...children] )

...旨在表明 props 是可选的，而不是它是一个数组。