React：渲染内联svg图标

Question

我有内联svg图标的代码：

@Icon = React.createClass
  render: ->
    <svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
      <title>img</title>
      <g stroke-width="2" stroke="#0070D9" fill="none" fill-rule="evenodd">
        <path d="M2 1h16a1 1 0 0 1 1 1v16a1 1 0 0 1-1 1H2a1 1 0 0 1-1-1V2a1 1 0 0 1 1-1z"/>
        <path d="M1.652 14.514l4.956-6.279 5.448 5.579 6.398-5.579M13 3.95a2.05 2.05 0 1 1 0 4.1 2.05 2.05 0 0 1 0-4.1z"/>
      </g>
    </svg>

但是反应会使用-跳过所有属性，例如：stroke-width="2"

Answer 1

使用camelCase。例如：strokeWidth而不是stroke-width。我已经用fiddle做了一个工作示例。