将从导入分配的React组件渲染为变量..如何?

时间:2016-02-10 22:35:45

标签: reactjs react-jsx

因此,我需要动态确定要显示的组件..例如,所以。我有:

import Component1 from '..somepath/Component1'
import Component1 from '..somepath/Component2'

var P = {
   red: Component1,
   blue: Component2
}

render() {
  var newComponent = P[color];
  return (
     <newComponent /> // not working
     {newComponent} // not working
    newComoponent // not working

  )
}

这种映射可能很大,因此无法进行切换或if / else。

如何让它在另一个组件中返回?

1 个答案:

答案 0 :(得分:6)

根据惯例,组件名称必须带有首字母大写:

render() {
  var NewComponent = P[color];
  return (
     <NewComponent />
  );
}

参考文献: