国产无码综合区,色欲AV无码国产永久播放,无码天堂亚洲国产AV,国产日韩欧美女同一区二区

vue3+ts+tinynce富文本編輯器+htmlDocx+file-saver 配合實(shí)現(xiàn)word下載

2年前作者：親親晴崽分類：Toy博客閱讀(24)違法舉報(bào)

這篇具有很好參考價(jià)值的文章主要介紹了vue3+ts+tinynce富文本編輯器+htmlDocx+file-saver 配合實(shí)現(xiàn)word下載。希望對大家有所幫助。如果存在錯(cuò)誤或未考慮完全的地方，請大家不吝賜教，您也可以點(diǎn)擊"舉報(bào)違法"按鈕提交疑問。

vue3 請下載html-docx-js-typescript，否則會(huì)報(bào)錯(cuò)類型問題

//報(bào)告導(dǎo)出word
import * as htmlDocx from "html-docx-js-typescript";
 //@ts-ignore
import { saveAs } from 'file-saver'

// 下載文件，
const downloadFile = (row)=> {
  try {
    const convertedFile = htmlDocx.asBlob(htmlstr);

    // 生成鏈接并且下載
    // const fileData = convertedFile
    convertedFile.then((fileData)=>{
      console.log(htmlstr,fileData)
      saveAs((fileData as Blob), row.reportName+'.docx', { encoding: 'UTF-8' })
    })

  } catch (error) {
    console.log(error)
  }
}

row.report效果及數(shù)據(jù)
vue3+ts+tinynce富文本編輯器+htmlDocx+file-saver 配合實(shí)現(xiàn)word下載,word,vue.js,tinynce,htmlDocx,file-saver

<p class="MsoNormal" style="line-height: 28.0pt; mso-line-height-rule: exactly; vertical-align: baseline;">&nbsp;</p>
<p class="MsoNormal" style="text-align: center; line-height: 28.0pt; mso-line-height-rule: exactly; vertical-align: baseline;" align="center"><span style="font-size: 22.0pt; font-family: 方正小標(biāo)宋_GBK; mso-hansi-font-family: 方正小標(biāo)宋_GBK; letter-spacing: -.3pt;">數(shù)據(jù)質(zhì)量報(bào)告模板</span></p>
<p style="text-align: center; line-height: 28.0pt; mso-line-height-rule: exactly; tab-stops: 92.15pt; text-autospace: none;" align="center"><span lang="EN-US" style="font-size: 16.0pt; mso-bidi-font-size: 10.0pt; font-family: 方正楷體_GBK; mso-hansi-font-family: 方正楷體_GBK; mso-bidi-font-family: 方正楷體_GBK; mso-font-kerning: 0pt;">&nbsp;</span></p>
<p class="MsoNormal" style="text-indent: 30.8pt; mso-char-indent-count: 2.0; line-height: 28.0pt; mso-line-height-rule: exactly; mso-outline-level: 1;"><span style="font-size: 16.0pt; mso-bidi-font-size: 10.0pt; font-family: 方正黑體_GBK; mso-hansi-font-family: 方正黑體_GBK; letter-spacing: -.3pt;">一、總體情況</span></p>
<p class="MsoNormal" style="text-indent: 32.0pt; mso-char-indent-count: 2.0; line-height: 28.0pt; mso-line-height-rule: exactly;"><span style="font-size: 16.0pt; font-family: 方正仿宋_GBK; mso-hansi-font-family: 方正仿宋_GBK; mso-bidi-font-family: 方正仿宋_GBK; mso-bidi-language: AR;">截至</span><span lang="EN-US" style="font-size: 16.0pt; font-family: 方正仿宋_GBK; mso-fareast-font-family: 宋體; mso-hansi-font-family: 方正仿宋_GBK; mso-bidi-font-family: 方正仿宋_GBK; color: blue; mso-bidi-language: AR;">&lt;</span><span style="font-size: 16.0pt; font-family: 宋體; mso-ascii-font-family: 方正仿宋_GBK; mso-hansi-font-family: 方正仿宋_GBK; mso-bidi-font-family: 方正仿宋_GBK; color: blue; mso-bidi-language: AR;">日期函數(shù)</span><span lang="EN-US" style="font-size: 16.0pt; font-family: 方正仿宋_GBK; mso-fareast-font-family: 宋體; mso-hansi-font-family: 方正仿宋_GBK; mso-bidi-font-family: 方正仿宋_GBK; color: blue; mso-bidi-language: AR;">&gt;</span><span style="font-size: 16.0pt; font-family: 方正仿宋_GBK; mso-hansi-font-family: 方正仿宋_GBK; mso-bidi-font-family: 方正仿宋_GBK; mso-bidi-language: AR;">，發(fā)現(xiàn)問題數(shù)據(jù)</span><span lang="EN-US" style="font-size: 16.0pt; font-family: 方正仿宋_GBK; mso-fareast-font-family: 宋體; mso-hansi-font-family: 方正仿宋_GBK; mso-bidi-font-family: 方正仿宋_GBK; color: blue; mso-bidi-language: AR;">&lt;</span><span style="font-size: 16.0pt; font-family: 宋體; mso-ascii-font-family: 方正仿宋_GBK; mso-hansi-font-family: 方正仿宋_GBK; mso-bidi-font-family: 方正仿宋_GBK; color: blue; mso-bidi-language: AR;">發(fā)現(xiàn)問題數(shù)據(jù)</span><span lang="EN-US" style="font-size: 16.0pt; font-family: 方正仿宋_GBK; mso-fareast-font-family: 宋體; mso-hansi-font-family: 方正仿宋_GBK; mso-bidi-font-family: 方正仿宋_GBK; color: blue; mso-bidi-language: AR;">&gt;</span><span style="font-size: 16.0pt; font-family: 方正仿宋_GBK; mso-hansi-font-family: 方正仿宋_GBK; mso-bidi-font-family: 方正仿宋_GBK; mso-bidi-language: AR;">條，</span></p>

調(diào)用
vue3+ts+tinynce富文本編輯器+htmlDocx+file-saver 配合實(shí)現(xiàn)word下載,word,vue.js,tinynce,htmlDocx,file-saver 文章來源地址http://www.zghlxwxcb.cn/news/detail-681628.html

到了這里，關(guān)于vue3+ts+tinynce富文本編輯器+htmlDocx+file-saver 配合實(shí)現(xiàn)word下載的文章就介紹完了。如果您還想了解更多內(nèi)容，請?jiān)谟疑辖撬阉鱐OY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持TOY模板網(wǎng)！

本文來自互聯(lián)網(wǎng)用戶投稿，該文觀點(diǎn)僅代表作者本人，不代表本站立場。本站僅提供信息存儲空間服務(wù)，不擁有所有權(quán)，不承擔(dān)相關(guān)法律責(zé)任。如若轉(zhuǎn)載，請注明出處：如若內(nèi)容造成侵權(quán)/違法違規(guī)/事實(shí)不符，請點(diǎn)擊違法舉報(bào)進(jìn)行投訴反饋，一經(jīng)查實(shí)，立即刪除！

分享到：

領(lǐng)支付寶紅包贊助服務(wù)器費(fèi)用

vue3富文本編輯器的二次封裝開發(fā)-Tinymce
歡迎點(diǎn)擊領(lǐng)取 -《前端開發(fā)面試題進(jìn)階秘籍》：前端登頂之巔-最全面的前端知識點(diǎn)梳理總結(jié) 專享鏈接簡介 1、安裝：pnpm add tinymce @tinymce/tinymce-vue === Vue3 + tinymce + @tinymce/tinymce-vue 2、功能實(shí)現(xiàn)圖片上傳、基金卡片插入、收益卡片插入、源代碼復(fù)用、最大長度限制、自定義表情包
2024年02月07日
瀏覽(101)
vue3使用quill富文本編輯器，保姆級教程，富文本踩坑解決
本文是封裝成組件使用先放效果圖先封裝組件，建立如下目錄全部代碼如下, 使用本文是第二個(gè)頁面使用這個(gè)富文本編輯器有可能watch監(jiān)聽中找不到ref，如果不能正常使用可以稍微改裝下在onMounted里賦值然后在setValue里拋出就好保姆級教程，有問題歡迎提出
2024年02月11日
瀏覽(27)
【新項(xiàng)目開發(fā)】vue3+ts+elementPlus+ffmpegjs開發(fā)純web端的視頻編輯器
當(dāng)在項(xiàng)目中使用新技術(shù)時(shí)，我們應(yīng)該首先進(jìn)行調(diào)研，了解其特點(diǎn)和使用方法。在實(shí)現(xiàn)功能時(shí)，我們可以采用最簡單的方式，而不必過于關(guān)注項(xiàng)目的設(shè)計(jì)和結(jié)構(gòu)。一旦掌握了新技術(shù)，我們可以根據(jù)其API屬性進(jìn)行代碼設(shè)計(jì)，以便更好地開發(fā)。以開發(fā)一個(gè)純web端的視頻編輯處理器為
2024年02月15日
瀏覽(85)
Vue3 代碼塊高亮顯示并可使用富文本編輯器編輯（highlight.js + wangEditor）
在Vue項(xiàng)目中實(shí)現(xiàn)以下功能： ??功能1. 在頁面中顯示代碼，并將其中的高亮顯示。 ??功能2. 允許對代碼塊進(jìn)行編輯，編輯時(shí)代碼也高亮顯示。 ??功能3. 可在編輯器中添加多個(gè)代碼塊，動(dòng)態(tài)渲染代碼高亮。 ? Step1: 安裝所需插件(本文使用npm安裝，若需
2023年04月21日
瀏覽(66)
vue3富文本編輯器vue-quill-editor、圖片縮放ImageResize詳細(xì)配置及使用教程
官網(wǎng)地址：https://vueup.github.io/vue-quill/ 效果圖 ?1、安裝 2、在vue.config.js中添加配置，否則quill-image-resize-module會(huì)出現(xiàn)Cannot read property ‘imports‘ of undefined報(bào)錯(cuò)問題 3、創(chuàng)建quillTool.js（用于添加超鏈接、視頻） 4、完整代碼
2024年02月04日
瀏覽(33)
8款 Vue 富文本編輯器
https://www.wangeditor.com/ http://tinymce.ax-z.cn/ https://www.itxst.com/tiptap/tutorial.html https://ckeditor.com/ckeditor-5/ https://quilljs.com/ https://www.froala.com/ https://summernote.org/ 基于bootstrap,比較突出的優(yōu)點(diǎn)就是能保持復(fù)制過來的東西的原有樣式，并且比較流暢。 https://www.cnblogs.com/xxflz/p/9777075.html https
2024年02月12日
瀏覽(79)
Vue + 富文本編輯器：打印模板設(shè)計(jì)
前言：有的項(xiàng)目需要用到打印，如果只有少數(shù)的地方需要用到打印，一般只需要固定模板進(jìn)行打印就行了，但是我們的項(xiàng)目總是與眾不同，明明只要固定模板就可以完成需求的，非要添加一個(gè)靈活的打印模板，而且還涉及到拖拉填充文本，真是腦細(xì)胞不知道死掉了多少! ! !
2024年02月09日
瀏覽(20)
7 款 Vue 3 富文本編輯器
富文本編輯器作為直接與用戶交互的內(nèi)容輸入生產(chǎn)工具，對大家的項(xiàng)目來說非常重要。選不好，配置不好，直接影響產(chǎn)品質(zhì)感和用戶體驗(yàn)，所以說在選擇編輯器方面花點(diǎn)時(shí)間是值得的。我試用了市面上所有主流富文本編輯器，篩掉長期不更新，bug 明顯，社區(qū)活躍度低，功能
2024年02月10日
瀏覽(23)
vue中使用wangeditor富文本編輯器
官方文檔? 項(xiàng)目中要求實(shí)現(xiàn)富文本編輯器取編輯內(nèi)容這種編輯器有好多選擇了wangeditor富文本編輯器首先根據(jù)文檔安裝再按照官方的指引 cv 如下代碼這個(gè)時(shí)候編輯器的功能已經(jīng)實(shí)現(xiàn)了如下圖 ?但是目前為止他還不是我想要的因?yàn)檫@個(gè)編輯器我想讓他在彈窗中出現(xiàn)，而且我
2023年04月26日
瀏覽(29)
vue wangeditor 富文本編輯器的使用
wangeditor 富文本編輯器，是實(shí)現(xiàn)類似CSDN文章編輯功能的插件（CSDN官方使用的是CKEditor 富文本編輯器）。 wangEditor官方文檔根據(jù)自己項(xiàng)目使用的框架，采取不同的引入方式，如vue2： npm install @wangeditor/editor-for-vue --save 在vue2中使用wangeditor? （官方文檔配置）上例配置的效果：
2024年02月14日
瀏覽(32)