是否有可能通過一個陣營組件作爲參數在一個容器組件

Question

的功能傳遞子組件作爲參數傳遞給父組件的功能，並試圖使不起作用

//React Container Component 
//Import Both Views and Render based on preference 
import PosterView from "./PosterView" 
import ListView from "./ListViewCard" 

... 

renderCardsBasedOnType(cardType){ 
    if(cardType === "poster"){ 
    return this.renderCards(PosterView) 
    }else{ 
    return this.renderCards(ListViewCard) 
    } 
} 
renderCards(component){ 
    let cards = this.props.list.map(function(cardData){ 
    return <component data={cardData}/> 
    }) 
    return cards 
} 
render(){ 
    let cards = this.renderCardsBasedOnType("poster") 
    return <div>{cards}</div> 
} 
...... 

Answer 1

嘗試Component代替component之間。 React需要一個用於jsx標記的upperCase：

renderCards(Component){ 
    let cards = this.props.list.map(function(cardData){ 
    return <Component data={cardData}/> 
    }) 
    return cards 
}