使用变量名称对组件进行渲染

Shi*_*Lee 3 components reactjs

我有一个未知的反应组件列表要呈现.

// this is a react component
var DefaultModule = require('./DefaultModule.js');
Run Code Online (Sandbox Code Playgroud)

<DefaultModule/> <---这会输出一些东西,因为名字正是里面的类名 DefaultModule.js

但如果我这样做

// this is a react component
var sssss = require('./DefaultModule.js');
Run Code Online (Sandbox Code Playgroud)

<sssss/> <---这不行

那么我有没有办法获取组件名称列表并相应地渲染它们?谢谢.

ps:反应组件看起来像这样

import React, {PropTypes, Component} from 'react';

class TestComponent extends Component {

  render() {
    return (
      <div>
     1123123123123123 hahaha small test
      </div>
    );
  }
}

export default TestComponent;
Run Code Online (Sandbox Code Playgroud)

Shi*_*Lee 7

我刚从讨论主题中找到答案......

是的,我可以这样做但反应组件必须以大写字母开头.所以现在Sssss将工作sssss.

https://github.com/facebook/react/issues/3365

The key is to use a capitalized variable name (Component) otherwise React will treat it as a built-in DOM element.