嵌套的React元素没有出现

Question

我是React的新手，有以下查询。考虑代码：

function Welcome(props:any) {
    return <h1>Hello, {props.name}</h1>;
}
function Sous() {
    return <h3>Under</h3>;
}

const element = <Welcome name="Jim" >
    <Sous/>
</Welcome>;
ReactDOM.render(element, document.getElementById('root'));

为什么浏览器仅返回Hello Jim而忽略<Sous/>？

Answer 1

组件实例化中的所有内容都映射到props.children。您需要在children内为Welcome指定插入点

function Welcome(props:any) {
    return <h1>Hello, {props.name}{props.children}</h1>;
}