在If条件下Coffeescript和渲染SVG

时间:2015-05-12 07:37:13

标签: svg coffeescript

我正在尝试为解释coffeescript的应用程序创建一个电池检查程序。我是coffeescript的新手,谷歌搜索没有帮助。

以下是我尝试的代码:

if charge <= 100
  render: ->"""
    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
      <path d="M0 0h24v24h-24z" fill="none"/>
      <path d="M7 17v3.67c0 .73.6 1.33 1.33 1.33h7.33c.74 0 1.34-.6 1.34-1.33v-3.67h-10z"/>
      <path fill-opacity=".3" d="M17 5.33c0-.73-.6-1.33-1.33-1.33h-1.67v-2h-4v2h-1.67c-.73 0-1.33.6-1.33 1.33v11.67h10v-11.67z"/>
    </svg>
  """

电池充满电量百分比。如果我尝试将svg渲染到if条件之外它可以工作,但遗憾的是没有if。

提前致谢!

1 个答案:

答案 0 :(得分:0)

以下是您的代码在coffescript.org控制台中编译的内容:

if (charge <= 100) {
  ({
    render: function() {
      return "<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\">\n  <path d=\"M0 0h24v24h-24z\" fill=\"none\"/>\n  <path d=\"M7 17v3.67c0 .73.6 1.33 1.33 1.33h7.33c.74 0 1.34-.6 1.34-1.33v-3.67h-10z\"/>\n  <path fill-opacity=\".3\" d=\"M17 5.33c0-.73-.6-1.33-1.33-1.33h-1.67v-2h-4v2h-1.67c-.73 0-1.33.6-1.33 1.33v11.67h10v-11.67z\"/>\n</svg>";
    }
  });
}

哪个什么都没做。

您应该考虑在:之后删除render