小编And*_*nus的帖子

如何传递道具以反应包裹在变量中的组件

我想动态呈现表格单元格。每个单元都是一个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组件的浏览器渲染列表,而不是cellAcellBcellC。函数返回元素为jsx(在</>标记中),因为我需要将prop传递给这些React组件。但是我错了。

如何将props传递给包裹在变量中的这个React组件?

谢谢!

javascript reactjs

4
推荐指数
1
解决办法
4632
查看次数

标签 统计

javascript ×1

reactjs ×1