arthur/ui
1
0
Fork 0
mirror of https://github.com/ArthurDanjou/ui.git synced 2026-01-14 20:19:34 +01:00
Code Issues Packages Projects Releases Wiki Activity

fix(Avatar): url error handling (#39)

Browse Source
This commit is contained in:
Sylvain Marroufin
2022-03-14 16:51:16 +01:00
committed by GitHub
parent 9554e801c2
commit fb3ff2e5fa
1 changed files with 14 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
src/runtime/components/elements/Avatar.vue
View File

@@ -1,6 +1,6 @@
<template>
<span :class="wrapperClass">
<img v-if="url" :class="avatarClass" :src="url" :alt="alt">
<img v-if="url && !error" :class="avatarClass" :src="url" :alt="alt" :onerror="() => onError()">
<span v-else-if="text || placeholder" :class="placeholderClass">{{ text || placeholder }}</span>
<span v-if="chip" :class="chipClass" />
@@ -102,6 +102,18 @@ const url = computed(() => {
})
const placeholder = computed(() => {
return (props.alt || '').split(' ').map(word => word.charAt(0)).join('').substr(0, 2)
return (props.alt || '').split(' ').map(word => word.charAt(0)).join('').substring(0, 2)
})
const error = ref(false)
watch(() => props.src, () => {
if (error.value) {
error.value = false
}
})
function onError () {
error.value = true
}
</script>