点击svg图标报错

Question

点击任意一个svg图标都会报错，虽然不影响事件执行，但是控制台总会出现错误

Answer 1

Wyatt6wm 2023-03-14 13:17:39

前面章节自己写的SvgIcon组件index.vue的template里面的标签外套一层div

Answer 2

Sunday 2023-03-13 09:08:47

你好

根据报错的信息来看

你的错误应该和 svg 组件没有关系.

我没有遇到过类似的错误，你可以尝试 《把错误代码注释，直到不出现错误。然后逐步放开，直到出现错误。》这样的方式来查找错误的原因。

• 提问者 城北丶 #1

  在Hamburger组件中的@click事件增加修饰符.stop可以解决这个问题。但是点击其他图标依然会报错。也就是说要给每个图标组件都要增加@click.stop。我不知道这是为什么

• Sunday 回复 提问者 城北丶 #2

  .stop 表示禁止冒泡，也就是说冒泡后会导致操作。可以看下冒泡后点击行为会到哪个 dom，找到报错的 dom ，然后分析 dom 出现错误的原因

• 提问者 城北丶 回复 Sunday #3

  无法找见具体原因，但是我通过以下方式可以解决，在SvgIcon组件中div容器增加@click.stop属性，在Hamburger组件的click事件使用@click.capture="toggleClick"。这样可以保证所有svg图标点击不会报错

点开查看后面1条评论