I
I
IvanIvanIvanIvanIvan2018-03-14 21:22:44
React
IvanIvanIvanIvanIvan, 2018-03-14 21:22:44

How to teach React.js to understand svg?

<svg width="200.00000000000003" height="200.00000000000003" xmlns="http://www.w3.org/2000/svg">

 <g>
  <title>background</title>
  <rect fill="#fff" id="canvas_background" height="72.17544" width="72.17544" y="-1" x="-1"/>
  <g display="none" id="canvasGrid">
   <rect fill="url(#gridpattern)" stroke-width="0" y="0" x="0" height="100%" width="100%" id="svg_1"/>
  </g>
 </g>
 <g>
  <title>Layer 1</title>
  <ellipse ry="26.6233" rx="29.54537" id="svg_2" cy="42.8576" cx="42.59811" fill-opacity="null" stroke-opacity="null" stroke-width="1.5" stroke="#000" fill="#fff"/>
 </g>
</svg>

An example of svg graphics. If I insert it into React, it seems to work, but in the console it gives
Warning: Unknown DOM property stroke-width errors. Did you mean strokeWidth?
How to fix it?

Answer the question

In order to leave comments, you need to log in

1 answer(s)
R
Ro37A, 2018-03-14
@IvanIvanIvanIvanIvan

Rewrite all attributes with a hyphen in camelCase and you will be happy.
doka

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question