Ahmed Waqas
Ahmed Waqas

Reputation: 255

How to pass props to a component which is being passed as value

here is my code scenario

const components = {
    body: {
      row: EditableFormRow,
      cell: EditableCell,
    },
  };

I am using components in another component like below.

<CustomTable
    columns={updatedcolumns}
    dataSource={dataSource}
    components={components}
    rowClassName={() => 'editable-row'}
    bordered
    size="middle"
    pagination={false}
    // scroll={{ x: '130%', y: 240 }}
  />

I want to pass a prop to EditableCell which is a component defined in another file. when I do following it gives me error

const components = {
    body: {
      row: EditableFormRow,
      cell: <EditableCell type="text"/>,
    },
  };

I am not sure how do I pass props. Please help.

Upvotes: 1

Views: 598

Answers (2)

Lucas Erlacher
Lucas Erlacher

Reputation: 63

cell: (props) => <EditableCell type="text" {...props}/>

Upvotes: 2

Clarity
Clarity

Reputation: 10873

You need to wrap the component in a function:

  cell: () => <EditableCell type="text"/>,

Upvotes: 3

Related Questions