Vue项目引用相对路径图片不显示问题

通常将图片放入src/assets/文件夹下，在view中绑定图片，如：

<van-image round width="2rem" height="2rem" :src="headerUrl" />

headerUrl是VM定义的图片路径，代码如下：

data () {
    return {
      headerUrl: '../assets/images/unlogin.png',
    }
  }

界面上图片不显示，解决办法，修改data中代码如下即可显示

  data () {
    return {
      headerUrl: require('@/assets/images/unlogin.png'),
    }
  }

即可显示