Open SeungHoon-Kang opened 2 months ago
TUI.editor를 사용하고 있는데, 드래그 앤 드랍으로 이미지 삽입하는 방식을 막고싶습니다.
툴바에 있는 이미지 삽입 버튼을 통해서, 기기의 폴더 내에서 이미지를 넣을 수 있는데,
이 방법 말고, 이미지를 폴더에서 드래그 앤 드랍으로 넣는 방법을 막고싶습니다.
현재 addImageBlob 으로 이미지 업로드를 처리하고 있는데, 드래그 앤 드랍을 따로 막는 방법이 있는지 궁금하여 문의드립니다.
`return ( <div style={{ width: '100%', textAlign: 'left' }}> <Editor ref={editorRef} initialValue={props.content || ''} previewStyle="horizontal" height="600px" placeholder="글을 입력하세요." initialEditType="wysiwyg" useCommandShortcut={true} onChange={handleChange} style={{ width: '80%' }} toolbarItems={[ ['heading', 'bold', 'italic', 'strike'], ['quote', 'ul', 'ol'], ['image', 'link'], ]} hooks={{ addImageBlobHook: async (blob: any, callback: any) => { const reader = new FileReader();
reader.onloadend = async () => { if (typeof reader.result === 'string') { const base64String = reader.result.split(',')[1]; const formData = new FormData(); formData.append('fileBase64', base64String); formData.append('fileName', blob.name); try { const res = await userApi.uploadImage(formData); if (res.data.rsltCd === '00') { const imageUrl = res.data.data.fileUrlS3; callback(imageUrl, 'image description'); } else { toastMsg('이미지 업로드 실패', 'error'); } } catch (error) { console.error('이미지 업로드 에러', error); toastMsg('이미지 업로드 중 오류가 발생했습니다.', 'error'); } } else { console.error('Failed to load file as base64 string'); toastMsg( '파일을 base64 문자열로 로드하는 데 실패했습니다.', 'error', ); } }; reader.readAsDataURL(blob); }, }} /> </div>
);`
위와 같이 코드를 사용하고 있습니다. 제가 놓친 부분이 있는건지 아니면, 드래그 앤 드랍 방식을 막는 방법은 따로 없는건지 알려주시면 정말 감사합니다.
TUI.editor를 사용하고 있는데, 드래그 앤 드랍으로 이미지 삽입하는 방식을 막고싶습니다.
툴바에 있는 이미지 삽입 버튼을 통해서, 기기의 폴더 내에서 이미지를 넣을 수 있는데,
이 방법 말고, 이미지를 폴더에서 드래그 앤 드랍으로 넣는 방법을 막고싶습니다.
현재 addImageBlob 으로 이미지 업로드를 처리하고 있는데, 드래그 앤 드랍을 따로 막는 방법이 있는지 궁금하여 문의드립니다.
`return ( <div style={{ width: '100%', textAlign: 'left' }}> <Editor ref={editorRef} initialValue={props.content || ''} previewStyle="horizontal" height="600px" placeholder="글을 입력하세요." initialEditType="wysiwyg" useCommandShortcut={true} onChange={handleChange} style={{ width: '80%' }} toolbarItems={[ ['heading', 'bold', 'italic', 'strike'], ['quote', 'ul', 'ol'], ['image', 'link'], ]} hooks={{ addImageBlobHook: async (blob: any, callback: any) => { const reader = new FileReader();
);`
위와 같이 코드를 사용하고 있습니다. 제가 놓친 부분이 있는건지 아니면, 드래그 앤 드랍 방식을 막는 방법은 따로 없는건지 알려주시면 정말 감사합니다.