I can't modify my SVG component in my React Application

Question

I have been trying to fill the color of an SVG component in React, but it won\'t work.

I\'ve tried using an image tag to React. However, I read on the React docs that CS

Answer 1

It looks like the best way to handle this would be to use the SVG code itself as a component, then use props to pass in the fill colors as needed.

// App
const App = React.createClass({
  render() {
    return (
      

        

          
        
        
        
      
    )
  }
});

// Icon
const IconOffice = React.createClass({
  getDefaultProps() {
    return {
      width: '100',
      height: '200',
      bookfill: '#f77b55',
      bookside: '#353f49',
      bookfront: '#474f59'
    };
  },
 render() {
   return (
     
   )
 }
});

ReactDOM.render(, document.querySelector("#main"));

https://css-tricks.com/creating-svg-icon-system-react/