class BlackBorderContainer extends React.Component {
        render(){
            console.log(this.props.children[0].props); //object
            this.props.children.map((val,i)=>{
                console.log(val);
                return <div key={i} className="black-board">{val.type}</div>
            })
        }
    }
    ReactDOM.render(
        <BlackBorderContainer>
            <div className='name'>My Name：Lucy</div>
            <p className='age'> My Age：<span>12</span></p>
        </BlackBorderContainer>,
        document.getElementById('example')
    )

我2個(gè)console打印出來(lái)的內(nèi)容 可以看出有三個(gè)對(duì)象，那我這里{val.type}為什么還是錯(cuò)誤的？
難道說(shuō)是因?yàn)?code><BlackBorderContainer>組件內(nèi)部的不對(duì)稱，一個(gè)是div一個(gè)是p的緣故？
{className: "name", children: "My Name：Lucy"}
{$$typeof: Symbol(react.element), type: "div", key: null, ref: null, props: {…},?…}
{$$typeof: Symbol(react.element), type: "p", key: null, ref: null, props: {…},?…}
從中可以看出我最后return的時(shí)候 val是正確輸出的，但是程序會(huì)報(bào)錯(cuò)
Uncaught Error: BlackBorderContainer.render(): A valid React element (or null) must be returned. You may have returned undefined, an array or some other invalid object.