fix: 头像异常时无法一直Loading 无法裁剪

This commit is contained in:
dap 2025-04-05 16:51:24 +08:00
parent 78c16c1016
commit 84d6559f25
2 changed files with 15 additions and 3 deletions

View File

@ -84,6 +84,10 @@ function handleReady(cropperInstance: Cropper) {
modalLoading(false);
}
function handleReadyError() {
modalLoading(false);
}
function handlerToolbar(event: string, arg?: number) {
if (event === 'scaleX') {
scaleX = arg = scaleX === -1 ? 1 : -1;
@ -128,9 +132,11 @@ async function handleOk() {
v-if="src"
:circled="circled"
:src="src"
crossorigin="anonymous"
height="300px"
@cropend="handleCropend"
@ready="handleReady"
@ready-error="handleReadyError"
/>
</div>
@ -322,7 +328,8 @@ async function handleOk() {
&-cropper {
height: 300px;
background: #eee;
background-image: linear-gradient(
background-image:
linear-gradient(
45deg,
rgb(0 0 0 / 25%) 25%,
transparent 0,

View File

@ -26,14 +26,14 @@ const props = defineProps({
src: { required: true, type: String },
});
const emit = defineEmits(['cropend', 'ready', 'cropendError']);
const emit = defineEmits(['cropend', 'ready', 'cropendError', 'readyError']);
const defaultOptions: Options = {
aspectRatio: 1,
autoCrop: true,
background: true,
center: true,
checkCrossOrigin: true,
checkCrossOrigin: false,
checkOrientation: true,
cropBoxMovable: true,
cropBoxResizable: true,
@ -94,6 +94,11 @@ async function init() {
if (!imgEl) {
return;
}
// 访
const resp = await fetch(props.src);
if (resp.status !== 200) {
emit('readyError');
}
cropper.value = new Cropper(imgEl, {
...defaultOptions,
crop() {