如何将具有道具的组件作为道具传递?

时间:2018-06-04 08:57:35

标签: javascript reactjs material-ui

我使用dev-express的react-grid库, 库中有一个Table组件,我们可以传递Cell组件, 在CustomCell内部,我使用Material UI菜单

  <Table
        columnExtensions={tableColumnExtensions}
        cellComponent= {CustomCell}
  />

在上面的案例菜单中工作正常,

但是我想把道具传递给这个组件,我尝试了以下

 <Table
        columnExtensions={tableColumnExtensions}
        cellComponent= {(props)=><CustomCell {...props} someFunc={this.someFunc} />}
/>

在这种情况下菜单不起作用,我想知道是否有另一种方法可以实现第二种情况。

2 个答案:

答案 0 :(得分:1)

鉴于您周围的Component提供了props,您可以这样:

class Foo extends React.Component {

  someFunc = () => {}

  render () {
    return <Table
      columnExtensions={tableColumnExtensions}
      cellComponent= {() => <CustomCell {...this.props} someFunc= 
        {this.someFunc} />}
      />
  } 
}

答案 1 :(得分:0)

您可以使用withProps

执行此操作
const CustomCellWithSomeFunc = withProps({someFunc: this.someFunc.bind(this)})(CustomCell);

<Table
    columnExtensions={tableColumnExtensions}
    cellComponent= {CustomCellWithSomeFunc/>}
/>