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

【问题标题】：Image height is reset to 0 after upgrading to Vue 3升级到 Vue 3 后图像高度重置为 0
【发布时间】：2021-01-14 09:44:27
【问题描述】：

我有以下图像定义。

模板：

<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 图像的高度？

【问题讨论】：

【解决方案1】：

尝试从height="150px" 中删除px 并保持如下：

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

数据属性应该是：

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

【讨论】：