使用阿里云的一个获取图信息的接口获取图片属性信息,查看orientation属性值,根据值判断是否旋转,并做样式调整
https://help.aliyun.com/document_detail/44975.html?spm=a2c4g.11186623.6.1301.5a15ced2P6oKBm
因为想的是重新操作DOM 所以方法在 beforeUpdate中调用了,
因为要循环图片数组,查看符合条件的图片,又得请求数据查看图片属性
用到了递归
getImgOrientation:{
if(this.index>=this.datas.infoList.length){
return;
}
this.$http({
methods: "GET",
url:url
}).then(res=>{
if (res.body.Orientation.value === "6") { //顺时针旋转90度(改变逆时针转回去)
} else if (res.body.Orientation.value === "8") {//逆时针旋转90度(改变顺时针转回去)
} else if (res.body.Orientation.value === "3") { //旋转180度
} else if (res.body.Orientation.value === "1") { //没旋转
}
this.index++;
this.getImgOrientation()
}) .catch(() => {
this.index++;
this.getImgOrientation();
console.warn('获取失败');
});
}
因为安卓和ios显示效果不同,所以也可以加个客户端判断