Vue2 html动态引入图片

在 Vue2 中，可以使用 `v-bind` 指令动态绑定图片的 `src` 属性。也可以使用 `require` 语法来引入图片，例如：

<template>
  <div>
    <img :src="imgSrc">
  </div>
</template>

<script>
export default {
  data() {
    return {
      imgSrc: require('@/assets/images/example.png')
    }
  }
}
</script>

其中 `@` 表示 `src` 目录。如果图片存放在其他目录中，需要修改图片路径。

另外，也可以使用 `computed` 属性来动态计算图片路径，例如：

<template>
  <div>
    <img :src="imgSrc">
  </div>
</template>

<script>
export default {
  data() {
    return {
      imgName: 'example.png',
      imgDir: '@/assets/images/'
    }
  },
  computed: {
    imgSrc() {
      return require(`${this.imgDir}${this.imgName}`)
    }
  }
}
</script>

这样就可以根据需要动态改变图片路径了。