el-image增加大图预览功能

控制台报错
[Vue warn]: Invalid prop: type check failed for prop “previewSrcList”. Expected Array, got String with value “http://xxxxxx.png”.
后台返回的数据是以字符串形式返回的,在显示列表时,已经整理好数据格式为array,但是还是报错
加了一个过滤,可能起到双重过滤的作用,就不再报错了


   <template slot-scope="scope">
      <el-image
        lazy
        v-for="(item,index) in scope.row.Img"
        :src="item"
        :key="index"
        :preview-src-list="scope.row.Img | filterImg"
        @error="imageErr(scope.row,scope.row.Img)"
      ></el-image>
    </template>

    filters: {
    	filterImg(item) {
      		if (typeof item === "string") {
        		return item.split("|");
      		}else{
        		return item
      		}
    	},
	}
Logo

前往低代码交流专区

更多推荐