!DOCTYPE htmlhtmlheadmeta charset="UTF-8"titleyuque編輯器/titlelink rel="stylesheet" type="text/css" /link rel="stylesheet" type="text/css" href="http://news.558idc.com/
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>yuque編輯器</title>
<link rel="stylesheet" type="text/css"
/>
<link rel="stylesheet" type="text/css" />
</head>
<body>
<div id="root" class="ne-doc-major-editor"></div>
<script>
window.onload = function() {
const {
createOpenEditor
} = window.Doc;
// 創(chuàng)建編輯器
const editor = createOpenEditor(document.getElementById('root'), {
darkMode: false,
input: {},
image: {
isCaptureImageURL: (url) => {
// 判斷當(dāng)前url是否需要轉(zhuǎn)存
// return true表示需要轉(zhuǎn)存，會(huì)調(diào)用createUploadPromise
// return false表示不需要轉(zhuǎn)存，直接用于展示
return true;
},
// 配置上傳接口,要返回一個(gè)promise對(duì)象
createUploadPromise: (request) => {
const {
type,
data
} = request;
if (type === 'url') {
// data 是一個(gè)url，表示需要轉(zhuǎn)存
} else if (type === 'file') {
// data是一個(gè)File
}
return Promise.resolve({
url: 'https://pgz-static.shidongvr.com/temp/hzy.jpg',
size: data.size, // 文件大小
filename: data.name
});
},
},
file: {
// 配置上傳接口,要返回一個(gè)promise對(duì)象
createUploadPromise: (file) => {
// file是一個(gè)File對(duì)象
console.log(file)
return Promise.resolve({
url: 'https://pgz-dzdsgl-fastly.shidongvr.com/profile/upload/2023/12/22/266e2aa5-79f7-45ec-b5eb-7e7a474338e8.zip',
size: file.size, // 文件大小
filename: 'https://pgz-dzdsgl-fastly.shidongvr.com/profile/upload/2023/12/22/266e2aa5-79f7-45ec-b5eb-7e7a474338e8.zip',
});
},
},
video: {
// 配置上傳接口,要返回一個(gè)promise對(duì)象
createUploadPromise: (file) => {
// file是一個(gè)File對(duì)象
return Promise.resolve({
url: 'https://pgz-dzdsgl-fastly.shidongvr.com/profile/upload/2023/12/22/4dc5803f-d790-4490-bf54-02d276b89afa.mp4',
size: file.size, // 文件大小
filename: file.name,
cover: '',
});
},
},
});
// 設(shè)置內(nèi)容
editor.setDocument('text/lake',
'<p><span style="color: rgb(255, 111, 4),rgb(243, 48, 171)">歡迎來(lái)到y(tǒng)uque編輯器</span></p>');
// 監(jiān)聽內(nèi)容變動(dòng)
editor.on('contentchange', () => {
console.info(editor.getDocument('text/lake'));
});
}
</script>
<script crossorigin src="https://unpkg.com/react@18/umd/react.production.min.js"></script>
<script crossorigin src="https://unpkg.com/react-dom@18/umd/react-dom.production.min.js"></script>\
<script src="https://gw.alipayobjects.com/render/p/yuyan_npm/@alipay_lakex-doc/1.12.0/umd/doc.umd.js"></script>
</body>
</html>
聲明：所有內(nèi)容來(lái)自互聯(lián)網(wǎng)搜索結(jié)果,不保證100%準(zhǔn)確性,僅供參考。如若本站內(nèi)容侵犯了原著者的合法權(quán)益，可聯(lián)系我們進(jìn)行處理。