Adding custom classes to react-virtualized grid

Question

I'm trying to add some custom classes to a grid component in react, I want to add a class if the row is even, a class is the row is odd and also a class to the first first grid row

I've got both arguments working, if I comment one out the other works but I can't wrap my head around how to get these two arguments to both work together, I don't want to use and && or || if that makes sense ... or if there's a more elegant way of writing my code

    getRowClassName(row) {
    return row % 2 === 0 ? "evenRow" : "oddRow";
    return row === 0 ? "FirstRow" : "";
}

I tried this but this only runs the second argument

    getRowClassName(row) {
    return row % 2 === 0 ? "evenRow" : "oddRow", row === 0 ? "FirstRow" : "";
}

Why don't you return an object which contains both elements: `return {even: /*...*/, first: /*...*/}` — Alvaro, Oct 04 '18 at 14:33
I think that's what I've been trying to figure out how to do, but I can't get that to work as expected at the moment — Neil Kelsey, Oct 04 '18 at 14:41

score 0 · Answer 1 · edited Oct 04 '18 at 14:43

0

I think the cleanest solution to my problem is to just separate these two arguments in to two different functions as such

getFirstRowClassName(row) {
    return row === 0 ? "FirstRow" : "";
}

getRowClassName(row) {
    return row % 2 === 0 ? "evenRow" : "oddRow";
}

And then I just add these both to my grid

edited Oct 04 '18 at 14:43

dance2die

35,807
39
131
194

answered Oct 04 '18 at 14:40

Neil Kelsey

811
4
13
31

Adding custom classes to react-virtualized grid

1 Answers1