Javascript React/JS：如何通过函数传递html元素？

假设我有：

const list_item = (key,str) => <li key={key}>{str}</li>

const list_item=（key，str）=>
{str}

在我的渲染函数中

<li key={mykey}> {mystring} <MdCheckCircle /> </li>

{mystring}

但是，在render方法中放置list_item函数时，无法添加

：

list_项（mykey，mystring+“”）
//在站点上呈现为字符串文字
列表项（mykey，mystring+）
//在站点上呈现为“[对象]”

---

如何传递此html元素以使其正确呈现？

您可以像传递另一个参数一样将组件直接传递到函数中

const list_item = (key, str, comp) => <li key={key}>{str} {comp}</li>;

const MdCheckCircle = () => <div>Circle</div>;

class App extends Component {
    render() {
        return <div>{list_item(1, "string", <MdCheckCircle />)}</div>;
    }
}

const list_item=（key，str，comp）=>
{str}{comp}
；
常量MdCheckCircle=（）=>Circle；
类应用程序扩展组件{
render（）{
返回{list_item（1，“string”，）}；
}
}

您可以像另一个参数一样将组件直接传递到函数中

const list_item = (key, str, comp) => <li key={key}>{str} {comp}</li>;

const MdCheckCircle = () => <div>Circle</div>;

class App extends Component {
    render() {
        return <div>{list_item(1, "string", <MdCheckCircle />)}</div>;
    }
}

const list_item=（key，str，comp）=>
{str}{comp}
；
常量MdCheckCircle=（）=>Circle；
类应用程序扩展组件{
render（）{
返回{list_item（1，“string”，）}；
}
}

您不能将

{mystring}

作为一个单独的组件，并将

mykey

和

mystring

作为道具传入吗？您能为上下文显示所有的呈现函数吗？@DarrenSweeney是的，但现在我的函数粒度太高了。@DarrenSweeney特别要求这样做是为了避免编写更具体的函数您不能有

{mystring}

作为单独的组件，并作为道具传入

mykey

和

mystring

？您能为上下文显示所有的呈现函数吗？@DarrenSweeney是的，但现在我的函数粒度太高了。@DarrenSweeney特别要求这样做是为了避免编写更具体的函数