例如我想通过循环数组生成组件:
import React, { Component } from 'react';
import { Button, Input } from 'antd';
const arr = ['Button', 'Input']; // 生成一个<Button /> 和一个<Input />
export default class MyComp extends Component {
renderComp = arr => {
return arr.map(V => {
return React.createElement(this.transform(V), null, null)
// 必须通过一个函数把字符串转换为对应组件才可以执行
// 我希望可以直接通过 <V /> 或者 React.createElement(V, null, null) 获得<Button /> 和 <Input />
})
}
transform = str => {
switch(str){
case 'Button':
return Button;
case 'Input':
return Input;
default:
return null;
}
}
render(){
return(
<div>
{this.renderComp(arr)}
</div>
)
};
}
请问该如何操作?
已经尝试过的还有new Function、dangerouslySetInnerHTML和eval
都无法实现=- =