React Trello - Card properties

Question

I'm using React Trello with a custom card component:

             <Board
                data={{ lanes }}
                editable={false}
                components={{ NewCardForm: CardForm, **Card: TrelloCard** }}
                style={{ background: 'transparent' }}
            />

In my Trello card component, I'm getting all card props, but I want to pass extra props, and I'm wondering how I can do it?

Answer 1

You can do it this way:

Create your custom card component:

function Card(props) {
 const {yourProps} = props;
 return (<div>{yourProps}</div>)
}

Create the components object (or use it directly in the Board Component):

const components = {
  Card: (props) => Card({ ...props, yourProps: 'hello world' }),
};

Then in your component:

<Board
  data={data}
  components={components}
/>