Question: Is it possible to set a custom key to each row? about react-redux-grid HOT 2 CLOSED

I've seen this use case with other grid components in the past. And I think it makes sense here. But rather than have a consumer pass in props to be added as attributes to the row, I think it makes most sense to create a rowRenderer, similar to how the column renderer works.

That way you could control the entire HTML structure of the row. Initially, I think it could look something like this.

const gridProps = {
    dataSource,
    columns,
    stateKey,
    rowRenderer: ({ children, row }) => {
        // children are the react cells, that will be computed by grid
        return (
            <tr class='my-custom-class' key={ row.symbol }>
                { children }
            </tr>
        );
    };
};  

const grid = <Grid { ...gridProps } />;

There are a few caveats to this approach:

1. It's up to the developer to ensure proper HTML structure. React will not allow the row component to be anything but a <tr>, and will throw an Invariant Violation if another DOM type is passed. (I think that's ok, the error will be explicit).
2. It's up to the developer to pass the children prop down, otherwise the cells will not be rendered. (Again, I'm ok with that).

Let me know your thoughts. Thanks!

from react-redux-grid.

I think the solution that you provided above is great. This component has fulfilled all of the functionalities that I required. Thanks again @bencripps.

from react-redux-grid.