reactjs - SVG use variables with ReactJS

Question

Is there a way to use variables with SVG in ReactJS? I want to draw a polyline, but the points always differ, so I could use variables for the points, but I can't seem to figure it out.

标签： reactjssvg

Answer 1

在 react 中绘制 SVG 不需要做任何特别的事情，只需像任何其他 JSX 一样渲染它，并在需要时使用动态值（或来自 的值props）：

render() {
  const cx = 10
  const cy = 10
  const r = 20

  return (
    <svg>
      <circle cx={cx} cy={cy} r={r} fill="red" />
    </svg>
  )
}