升级到 Vue 3 后图像高度重置为 0

Question

我有如下图片定义。

模板：

<img :src="logoSVG" height="150px" alt="logo" />

JS:

data() {
  return {
    logoSVG: require('./assets/logo.svg')
  }
}

此代码在Vue 2下运行良好。注意图片的高度直接在图片中设置。

问题：我升级到Vue 3后，渲染组件中的图片高度设置为0。

这是它生成的内容：

<img src="/img/logo.136099f1.svg" height="0" alt="logo">

问题：如何让Vue 3正确渲染SVG图片的高度？

Answer 1

尝试从 height="150px" 中删除 px 并将其保持为 :

<img :src="logoSVG" height="150" alt="logo" />

数据属性应该是：

data() {
  return {
    logoSVG: require('./assets/logo.svg').default 
  }
}

Image height is reset to 0 after upgrading to Vue 3