React組件未在Bootstrap選項卡中呈現

Question

正在顯示我的每個標簽和標簽面板； 但是，沒有渲染家具組件。 我嘗試實施此方法時是否存在重大問題？

    <Tabs defaultActiveKey={Object.keys(this.state.fTypes)[1]} transition={false} >
    {Object.keys(this.state.fTypes).map((key, value)=>{
      const furniturePieces = Object.keys(this.state.fTypes[key]);
      return(
        <Tab eventKey={key} title={key} style={{width: '100%', height: '100px', backgroundColor: 'grey' }}>
        {this.renderTabDisplay(furniturePieces, key)}
        </Tab>
      )
    })}
  </Tabs>

    renderTabDisplay(furnPieces, key){
furnPieces.map((piece, info)=>{
  const furniturePiece = this.state.fTypes[key][piece];
  return(
    <Furniture
    furniture={furniturePiece}
    inGrid={false}
    conversion={0}
    />
  )
})

}

Answer 1

您不是從renderTabDisplay返回的， renderTabDisplay向函數添加返回。

renderTabDisplay(furnPieces, key){
  return furnPieces.map((piece, info)=>{
  const furniturePiece = this.state.fTypes[key][piece];
  return(
    <Furniture
    furniture={furniturePiece}
    inGrid={false}
    conversion={0}
    />
  )
})
}

Answer 2

經過下面的代碼后，我可以看到您沒有返回任何內容。

//為其添加了返回功能，並且可以正常工作。

renderTabDisplay(furnPieces, key){
return furnPieces.map((piece, info)=>{
  const furniturePiece = this.state.fTypes[key][piece];
  return(
    <Furniture
    furniture={furniturePiece}
    inGrid={false}
    conversion={0}
    />
  )
})

快樂的編碼:)