SVG与ReactJS一起使用变量

Question

有没有办法在ReactJS中将变量与SVG一起使用？ 我想画一条折线，但是这些点总是不同的，所以我可以为这些点使用变量，但是我似乎无法弄清楚。

Answer 1

在反应中绘制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>
  )
}