如何将多个props传递给由React.createElement创建的元素？

Question

React.createElement(类型, [属性], [...子元素])

正如React文档所说。但是，当我使用多个属性时它并不起作用。我尝试了传递一个键值对象数组，传递一个包含键值对的容器对象，但都没能成功。让我展示一下我的尝试：

//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} />

什么是传递多个 props 的必要语法？

- Gergő Horváth

---

文档中 React.createElement( type, [props], [...children] ) 中的 [props] 表示它是可选的，而不是一个数组。你的 props 应该是一个对象，比如 { placeholder: "Message", rows: "4", cols: "50"}。 - Tholle

Answer 1

props 应该是一个非数组对象，而不是一个数组。你创建的 props 数组看起来很容易可以成为单个对象，而不是对象数组。所以不要这样写：

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

也许

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

正如Tholle在评论中指出的那样，文档中显示的语法中的[]：

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

这是为了表明props是可选的，而不是数组。

- T.J. Crowder