fix: 头像异常时无法一直Loading 无法裁剪
This commit is contained in:
parent
78c16c1016
commit
84d6559f25
@ -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,
|
||||
|
@ -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() {
|
||||
|
Loading…
Reference in New Issue
Block a user