JSX動態組件 - 未知道具

Question

我想後，動態地確定他們的名字來渲染成分，我在<resultComponent>標籤得到這個

未知道具ent。從元素中刪除此道具。

違規代碼，另一個組件

<ul> 
    {this.state.results.map(entity => { 
     var resultComponent = null; 
     var key = null; 

     if (entity instanceof ProjectModel) { 
     resultComponent = ProjectResult; 
     key = "p"; 
     } else { 
     resultComponent = UserResult; 
     key = "u"; 
     } 

     return <resultComponent key={key + entity.id} ent={entity}/>; 
    })} 
    </ul> 

Answer 1

您應該重命名您的組件，因此它通過大寫字母開頭之內。

JSX標籤名稱約定（小寫字母名稱是指內置的 組件，大寫的名稱是指自定義組件）。

因此，<ResultComponent key={key + entity.id} ent={entity}/>;應該工作。