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}/>;应该工作。