React.js: Inline styling of particular elements of an SVG?

Viewed 68

I'm in the process of learning React right now, and I'm importing an SVG usig "svg-react-loader". I was wondering if there is a way to style parts of the SVG using inline styling? For example if my svg has rect and circle elements in it, it is possible to style those two shapes differently? My intuition was to have something like this:

var style = {
    '.rect': {
        stroke:"green"
    },
    '.circle': {
        stroke:"red"
    }
}

render() {
    return (<TestSVG style={style}/>)
};

Of course, this doesn't work. Any help is appreciated.

Thanks!

0 Answers
Related