Svg图片不显示

Question

老师你好，帮分析下我这个图标没有出来可能问题会出在哪里呢？
我在body里面已经看到了大svg

然后在具体的地方也引用进来了，如图

登录界面的代码，如图

界面显示如图

问题也查了好久，没有查出来，帮看下是哪里出问题了。

Answer 1

Sunday 2022-12-14 22:24:37

你好：

制作 svgIcon 组件主要的关键点如下：

1. 指定  svg -> use 标签

2. 指定对应类名

3. 将 svg 图标资源，放入到项目中

4. 通过 require.context 注册 svg 图标

5. 通过 svg-sprite-loader 来处理 svg 的加载

如果图标无法显示，那么可以根据以上点进行下检查

• 提问者 慕村8337265 #1

  1、指定  svg -> use 标签，这个已经有了。
  2、指定对应类名，是use里面的吗，这个在DOM上面已经有了
  <svg class="svg-icon" aria-hidden="true" data-v-0a438114="" data-v-2607fb58=""><use xlink:herf="#icon-article-create" data-v-0a438114=""></use></svg>
  3，4、资源已经放进去了，并且在BODY里面已经可以看到了。
  5、在哪里可以看到svg-sprite-loader已经生效了呢？

• 提问者 慕村8337265 #2

  问题已解决，href写成herf. 粗心惹得祸，不过也好，这也让我把这个svg显示原理好好地学习了一遍。