Vue 使用 el-avatar 头像无法直接加载本地图片问题

1、导入图片

//在script中导入
 
import heada_Image from"../assets/headInage.jpg"
 
//在data中定义
 
data() {
    
    return {
 
      headImage:heada_Image,
   }
}

2、在 el-avatar使用

网页图片可以直接获取，不需要使用绑定功能

  <el-avatar 
     :size="38" 
     :fit="fit" 
     :src="headImage">
    </el-avatar> 
    <!--https://cube.elemecdn.com/0/88/03b0d39583f48206768a7534e55bcpng.png-->

3、网页图片展示：

<el-avatar 
 :size="38" 
 :fit="fit" 
 src="https://cube.elemecdn.com/0/88/03b0d39583f48206768a7534e55bcpng.png">
</el-avatar>