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

【Vue】 在 vue 中使用 iframe 掛載 html 文件

這篇具有很好參考價(jià)值的文章主要介紹了【Vue】 在 vue 中使用 iframe 掛載 html 文件。希望對(duì)大家有所幫助。如果存在錯(cuò)誤或未考慮完全的地方,請(qǐng)大家不吝賜教,您也可以點(diǎn)擊"舉報(bào)違法"按鈕提交疑問(wèn)。

  1. 首先需要將要掛載的html文件放到public 文件夾中

【Vue】 在 vue 中使用 iframe 掛載 html 文件,工作隨記,vue.js,html,javascript文章來(lái)源地址http://www.zghlxwxcb.cn/news/detail-581434.html

  1. 路徑的引用形式
<iframe ref="sheet" src="/luckysheet.html" width="100%" height="100%"></iframe>
  1. 通過(guò)綁定 ref 獲取到 iframe,data為我需要傳遞的數(shù)據(jù),通過(guò) iframes.postMessage 的方法進(jìn)行傳遞。
sentMsgSheet(data) {
	const sheetWindow = this.$refs.sheet.contentWindow;
	if (sheetWindow) {
		sheetWindow.postMessage(data, '*');
	}
}
sentMsgSheet([]);
  1. postMessage 通信具體用法請(qǐng)參考:https://blog.csdn.net/qq_45677671/article/details/128238860

到了這里,關(guān)于【Vue】 在 vue 中使用 iframe 掛載 html 文件的文章就介紹完了。如果您還想了解更多內(nèi)容,請(qǐng)?jiān)谟疑辖撬阉鱐OY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章,希望大家以后多多支持TOY模板網(wǎng)!

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

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

相關(guān)文章

  • 【Vue】Vue 使用 Print.js 打印選中區(qū)域的html,用到的是Element ui table表格,解決頁(yè)面樣式不出現(xiàn)或者table表格樣式錯(cuò)亂問(wèn)題?。?!

    【Vue】Vue 使用 Print.js 打印選中區(qū)域的html,用到的是Element ui table表格,解決頁(yè)面樣式不出現(xiàn)或者table表格樣式錯(cuò)亂問(wèn)題!??!

    需求 : 打擊打印按鈕,文字內(nèi)容以及表格中的內(nèi)容 解決方案 加上這句就好了!完美! 一、因?yàn)楸砀駭?shù)據(jù)過(guò)多,之前加了表格滾動(dòng)條,但是打印出來(lái) 會(huì)把表格上的滾動(dòng)條也打印出來(lái),所以這里改成了 給彈框加滾動(dòng)條,去掉表格中的滾動(dòng)條 2.1 原因: table-layout: fixed導(dǎo)致的,

    2024年02月09日
    瀏覽(22)
  • 9.Vue前端使用iframe集成帆軟報(bào)表的單點(diǎn)登錄

    9.Vue前端使用iframe集成帆軟報(bào)表的單點(diǎn)登錄

    一、背景 需要把帆軟報(bào)表內(nèi)嵌到若依里面來(lái)。 二、帆軟設(shè)置 2.1 帆軟報(bào)表的url 打開(kāi)帆軟后端里面的【目錄管理】查看具體報(bào)表的url 帆軟報(bào)表的具體地址為: Frm聚合報(bào)表地址: 【帆軟的服務(wù)http】+【/webroot/decision/view/form?viewlet=demo/demo.frm】 CPT普通報(bào)表的地址:【帆軟的服務(wù)ht

    2024年01月25日
    瀏覽(16)
  • Vue中使用pdf.js實(shí)現(xiàn)在線預(yù)覽pdf文件流

    以下是在Vue中使用pdf.js實(shí)現(xiàn)在線預(yù)覽pdf文件流的步驟: 在需要使用的組件中,使用以下代碼引入pdf.js: 使用pdf.js的 getDocument() 方法加載pdf文件流??梢詫⑽募髯鳛锽lob對(duì)象傳遞給該方法。例如,可以使用axios從服務(wù)器獲取pdf文件流: 在 loadPdf() 方法中,使用 getDocument() 方法

    2024年02月09日
    瀏覽(96)
  • vue頁(yè)面內(nèi)嵌iframe使用postMessage進(jìn)行數(shù)據(jù)交互(postMessage跨域通信)

    vue頁(yè)面內(nèi)嵌iframe使用postMessage進(jìn)行數(shù)據(jù)交互(postMessage跨域通信)

    什么是postMessage postMessage 是 html5 引入的 API ,它允許來(lái)自 不同源 的腳本采用 異步方式進(jìn)行有效的通信 ,可以實(shí)現(xiàn)跨文本文檔,多窗口,跨域消息傳遞.多用于窗口間數(shù)據(jù)通信,這也使它成為 跨域通信 的一種有效的解決方案. vue父頁(yè)面(嵌入iframe的頁(yè)面) 在vue中要使用iframe上的pos

    2023年04月25日
    瀏覽(23)
  • 前端HTML、CSS、JS、VUE3 匯總

    前端HTML、CSS、JS、VUE3 匯總

    學(xué)習(xí)https://developer.mozilla.org/zh-CN/docs/Learn/CSS 提示:這里可以添加系列文章的所有文章的目錄,目錄需要自己手動(dòng)添加 使用VS Code運(yùn)行前端代碼 在VS Code上安裝前端插件 正在更新中~ ? 提示:這里可以添加本文要記錄的大概內(nèi)容: 學(xué)習(xí)路線 知識(shí)定位 HTML基礎(chǔ) 標(biāo)簽、表格、表單、

    2024年02月13日
    瀏覽(69)
  • Vue3——html-doc-ja(html導(dǎo)出為word的js庫(kù))

    Vue3——html-doc-ja(html導(dǎo)出為word的js庫(kù))

    官方地址? html-doc-js - npm 在 exportWord 方法執(zhí)行時(shí),將頁(yè)面中mjx-assistive-mml 節(jié)點(diǎn)清除即可,如下圖所示

    2024年04月14日
    瀏覽(27)
  • 截屏插件 js-web-screen-shot(Vue 、html)

    截屏插件 js-web-screen-shot(Vue 、html)

    最近有個(gè)需求是需要再頁(yè)面上截屏并上傳的,于是找到了這個(gè)插件【js-web-screen-shot】 先在package.json中添加這個(gè) 然后 npm install 然后在對(duì)應(yīng)頁(yè)面的vue文件的 script 中 import 接下就可以使用了; 使用方式大概就是 定義一個(gè)按鈕,來(lái)觸發(fā)構(gòu)建該插件對(duì)象(也可以用其他方式) 然后就

    2024年02月12日
    瀏覽(18)
  • 前端vue優(yōu)雅的寫(xiě)出描述列表,el-descriptions,思路分享【隨記】

    對(duì)于代碼的優(yōu)雅來(lái)說(shuō),可能每個(gè)人的看法是不一樣的,但是對(duì)我來(lái)說(shuō),簡(jiǎn)潔,易懂,容易維護(hù),就夠了。 接下來(lái)這段代碼是封裝組件時(shí)用到的,主要是當(dāng)時(shí)的詳情彈窗要彈得東西太多了。 這只是一個(gè)思路,一種啟發(fā)。 能夠做到思路打開(kāi)是最好的,不要局限在這一種方法里,

    2024年02月16日
    瀏覽(21)
  • vue3項(xiàng)目使用pdf.js插件實(shí)現(xiàn):搜索高亮、修改pdf.js顯示的頁(yè)碼、向pdf.js傳值、控制搜索、處理接口文件流

    vue3項(xiàng)目使用pdf.js插件實(shí)現(xiàn):搜索高亮、修改pdf.js顯示的頁(yè)碼、向pdf.js傳值、控制搜索、處理接口文件流

    官網(wǎng)地址:http://mozilla.github.io/pdf.js/ 中文文檔地址:https://gitcode.gitcode.host/docs-cn/pdf.js-docs-cn/print.html PDF.js是基于HTML5技術(shù)構(gòu)建的,用于展示可移植文檔格式的文件(PDF),它可以在現(xiàn)代瀏覽器中使用且無(wú)需安裝任何第三方插件。 pdf.js主要包含兩個(gè)庫(kù)文件 pdf.js:負(fù)責(zé)API解析 pdf.wor

    2024年02月13日
    瀏覽(29)
  • vue-codemirror實(shí)現(xiàn)一個(gè)前端代碼在線編輯器,可處理 HTML,VUE,JS,CSS代碼在線編輯

    vue-codemirror實(shí)現(xiàn)一個(gè)前端代碼在線編輯器,可處理 HTML,VUE,JS,CSS代碼在線編輯

    先找個(gè)目錄創(chuàng)建一個(gè)vue項(xiàng)目 例如 我們想要項(xiàng)目叫 editor 在終端執(zhí)行 2和3其實(shí)都可以 但個(gè)人建議 最近還是2會(huì)更穩(wěn)定一些 在終端執(zhí)行 引入依賴(lài)包 然后在項(xiàng)目src目錄下創(chuàng)建 utils 文件夾 里面創(chuàng)建一個(gè)setting.js 參考代碼如下 然后 這邊 調(diào)用組件的代碼 因?yàn)轫?xiàng)目也剛創(chuàng) 我直接寫(xiě) s

    2024年02月15日
    瀏覽(32)

覺(jué)得文章有用就打賞一下文章作者

支付寶掃一掃打賞

博客贊助

微信掃一掃打賞

請(qǐng)作者喝杯咖啡吧~博客贊助

支付寶掃一掃領(lǐng)取紅包,優(yōu)惠每天領(lǐng)

二維碼1

領(lǐng)取紅包

二維碼2

領(lǐng)紅包