鍍金池/ 問(wèn)答/數(shù)據(jù)庫(kù)  HTML/ react自定義組件無(wú)法顯示后面添加的內(nèi)容

react自定義組件無(wú)法顯示后面添加的內(nèi)容

組件內(nèi)代碼:
clipboard.png

使用組件的地方:
clipboard.png

只能顯示原有的PageTitle組件里的內(nèi)容,后面添加的div里的內(nèi)容無(wú)法顯示。
瀏覽器Console并無(wú)報(bào)錯(cuò),也能正常編譯,但是就是無(wú)法顯示,源代碼里也沒(méi)有div這段內(nèi)容。
新手求各位大佬求助,出現(xiàn)這個(gè)可能因?yàn)槭裁磳?dǎo)致的呢?還是我的用法不對(duì)?非常感謝各位大佬。

回答
編輯回答
朕略萌

沒(méi)看懂PageTitle和添加商品之間的關(guān)系啊。

如果這倆是并列的結(jié)構(gòu),那就直接寫(xiě)<PageTitle title="商品列表" />就可以,不用單獨(dú)寫(xiě)閉合標(biāo)簽。

如果是包含關(guān)系,那就在PageTitlereturn里面對(duì)應(yīng)的地方寫(xiě){this.props.children}

類似這樣,this.props.children就是你用PageTitle包起來(lái)的內(nèi)容

// PageTitle
render(){
    return(
        <section >
            <h1></h1>
            <ol></ol>
            {this.props.children}
        <section />
    )
}
2018年4月6日 01:41