vue 图片不存在时 显示自定义图片

遇见的问题: 当请求的图片为空时,默认图片,路径是对的,但是就是不出来

建议放在store里面,因为使用的自定义图片的地方可能有多处:

第一种:多个页面需要使用时

//这里我是直接放在store里面的,因为我还有其他地方要使用这个图片
	const state = {
				defaultimg:'this.src="' + require('../assets/img/dehead.jpg') + '"',
       }
//这里我是直接放在store里面的,因为我还有其他地方要使用这个图片
//这里的onerror不需要管,直接复制
	<img  :onerror="$store.state.defaultimg" :src="userInfo.avatar" alt="" class="headImg">

第二种:单页面使用

//默认图片的路径
	defaultimg: require('../assets/img/dehead.jpg')
//使用的方法都是一样的
	<img  :onerror="defaultimg" :src="userInfo.avatar" alt="" class="headImg">
	// 或者用三目运算: 判断后台传的数据是否为空,为空显示默认的图片
	<img :src="item.portrait == null ? defaultimg : item.portrait" alt="">

userInfo.avatar后台获取的数据

ok结束啦,有没有大佬,带带我这个菜鸡!!!!!

你可能感兴趣的:(vue,vuex)