1.img在ie下 render函数不渲染问题
2. authImg 是组件 srcToken.vue
import authImg from '@/components/srcToken/srcToken.vue'
//iview table columns
{
title: '图标',
key: 'appIcon',
width: 120,
align: 'center',
render: (h, params) => {
return h('div', [
h(authImg, {
props: {
authSrc: params.row.appIcon
},
style: {
width: '40px',
height: '40px'
}
})
])
}
},
img加token的组件 srcToken.vue代码
<template>
<img ref="img" :authsrc='authSrc'/>
</template>
<script>
export default {
name: 'authImg',
props: {
authSrc: {
type: String,
required: false,
default: ''
}
},
mounted () {
let token = sessionStorage.getItem('menuList')
Object.defineProperty(Image.prototype, 'authsrc', {
writable: true,
enumerable: true,
configurable: true
})
let img = this.$refs.img
let request = new XMLHttpRequest()
request.open('get', this.authSrc, true)
request.responseType = 'blob'
request.setRequestHeader('token', token)
request.onreadystatechange = e => {
if (request.readyState === XMLHttpRequest.DONE && request.status === 200) {
img.src = URL.createObjectURL(new Blob([request.response], { type: 'application/octet-stream' }))
img.onload = () => {
window.URL.revokeObjectURL(img.src)
}
}
}
request.send(null)
}
}
</script>