如何在 Django 模板中正确包含 SVG 精灵表

Question

我创建了一个 SVG sprite 表，现在正在研究在 Django 模板中使用它的各种方法。

最简单的方法是：

1. 在文件夹中添加精灵表templates/（例如templates/svg_spritesheet.svg）
2. 将其包含在 Django 模板中，如下所示：{% include "svg_spritesheet.svg" %}
3. 通过以下方式在 HTML 代码中调用给定的 svg：<svg><use xlink:href="#my_svg"></use></svg>

这对我有用。但这种方法存在操作上的缺陷。

例如：我通常将静态资源存放在{{ STATIC_URL }}. 这对于组织目的来说更好。其次，我对{{ STATIC_URL }}. 不过，我的文件夹没有使用此类缓存/templates。

因此，很自然地，在我看来，如果我将 SVG spritesheet 停放在 处会更好{{ STATIC_URL }}。但是一旦我这样做了，如何将它包含在我的 Django 模板中呢？

以下方法均无效：

1. {% include 'static/svg_spritesheet.svg' %}
2. {% include '{{ STATIC_URL }}svg_spritesheet.svg' %}
3. <object type="image/svg+xml" data="{{ STATIC_URL }}svg_spritesheet.svg"></object>
4. <link type="image/svg+xml" href="{{ STATIC_URL }}svg_spritesheet.svg">

专家能否给出一个说明性示例，说明如何使用放置在 处的 SVG 精灵表{{ STATIC_URL }}？提前致谢（如果有必要，我正在使用Django 1.8.19该项目）。

---

注意：以防万一您错过了 - 这个问题涉及SVG 精灵表，而不是单个 SVG。单个精灵表包含多个 SVG 图像 - 可以根据需要有选择地调用这些图像。

Answer 1

答案就在我眼皮底下。

从 spritesheet 渲染 SVG 时只需插入所需的位置：

{% load static %}
<svg>
  <use 
    href="{% static "svg_spritesheet.svg" %}#my_image"
  >
  </use>
</svg>

这样，您可以将 SVG spritesheets 保存在static文件夹中 - 因此所有/任何缓存基础设施都完全适用。快乐编码！