我想动态呈现表格单元格。每个单元都是一个React组件。我试图将这些React组件导出为包装函数。
例如:
import cellA from './cellA'
import cellB from './cellB'
import cellC from './cellC'
let content = { cellA, cellB, cellC }
function tableize (a) {
let resultFn = {}
Object.keys(a).forEach((k) => {
let element = a[k]
resultFn[k] = function (data) {
return (<element data={data} />)
}
})
return resultFn
}
export default tableize(content)
Run Code Online (Sandbox Code Playgroud)
问题在这条线上:
return (<element data={data} />)
Run Code Online (Sandbox Code Playgroud)
结果是命名为element的React组件的浏览器渲染列表,而不是cellA,cellB,cellC。函数返回元素为jsx(在</>标记中),因为我需要将prop传递给这些React组件。但是我错了。
如何将props传递给包裹在变量中的这个React组件?
谢谢!