Vue中动态（import 、require）显示img图片

vue中，经常会遇到显示图片的问题，

如果是一个普通组件的话，那么这样就可以了

<img src="../assets/images/avtor.jpg" width="100%">

但是呢，如果想写成动态的呢，可以试试如下办法：

<img :src="logo">
import logo from '@assets/images/avatar.png';
data() {
    return {
        logo,
    }
}

此种办法必须要在data 里注册一下，否则因为后直接用会不显示。

 

<img :src="logo">
data() {
    return {
        logo:require("@assets/images/avatar.png"),
    }
}