根据用户

Question

我的申请中有四个实体。每个实体都有自己的角色。如果用户的id为1，则页面应显示entity1组件，如果user的id为2，则页面应显示entity2。我可以证明这一点，但无法按照我的方式传递道具。

这就是我所做的

const userTypes = [
  { id: '1', val: <Entity1 /> },
  { id: '2', val: <Entity2 /> },
  { id: '3', val: <Entity3 /> },
  { id: '4', val: <Entity4 /> }
];

const renderComponent = props => {
  const component = userTypes.filter(x => x.id === props.user.id);
  if (component) {
    return component[0].val;
  } else {
    return <div>can't get route. unknown issue.</div>;
  }
};

export default renderComponent;

这种方式我不能传递道具

Answer 1

尝试：

if (component) {
  const Component = component[0].val;
  return <Component />;
} else {
  return <div>can't get route. unknown issue.</div>;
}