【发布时间】：2019-06-03 16:03:24
【问题描述】：
我正在使用 blazor 在页面上生成 SVG 项目。这很好用，除非我尝试创建 <clipPath> 标签。 Blazor 将其大小写更改为 <clippath>，这不是可接受的 SVG 标记，因此什么也不做。
有没有办法让 Blazor 保持我的标签大小写不变？
编辑：示例代码
<svg width="200" height="200">
<g clip-path="url(#myClip)">
<rect width="200" height="200" fill="red"></rect>
<clipPath id="myClip">
<circle cx="100" cy="100" r="100" fill="none"></circle>
</clipPath>
</g>
</svg>
【问题讨论】：
-
我认为问题不是问题...
-
@Issac 是的，这就是问题所在。我已经对此进行了测试。如果您使用某种编辑器，例如 codepen 或 jsfiddle 甚至记事本，并在生成代码时故意输入
<clippath>，它会自动将其更正为<clipPath>。但是，Blazor 对我来说正好相反。因此，如果您使用检查器将您的<clipPath>更改为<clippath>，您会注意到它不再有效。这就是为什么我需要让 Blazor 将其保留为<clipPath> -
请执行以下操作： 1. 转到developer.mozilla.org/en-US/docs/Web/SVG/Element/clipPath 2. 单击“在 CodePen 中打开”按钮查看相关示例。现在将 clipPath 更改为 clippath 并查看示例是否仍然有效...
-
@Issac 正如我之前所说，如果您在 codepen 中将“clipPath”编辑为“clippath”，浏览器会为您计算出来并将其更正为“clipPath”。您可以通过在进行更改后打开检查器并看到它仍然是“clipPath”来确认这一点。但 Blazor 实际上正在使用我的“clipPath”并将其更改为“clippath”，而浏览器并没有将其更正回来。将我刚刚添加的示例代码添加到 Blazor 应用程序中的 Blazor 组件中，您就会明白我的意思。然后把它插入codepen，这样你就可以看到区别了。
-
@JoeHigley 我怀疑 Blazor 因此在 HTML 命名空间而不是 SVG 命名空间中创建元素。