











当文件不存在,不想错误的信息呈现在iframe内嵌框架中,而是显示自定义通俗信息。
html markup,将修改如下:
<div class="right" style="margin-left: 3px; width: 888px;"> <iframe v-show="hasFile" id="frameContainer" loading="lazy" style="width: 100%; height: 500px; border: 0px none #00000000"></iframe> <div v-show="!hasFile" style="width:100%;height:100%;display:flex;align-items:center;justify-content:center;color:#999;"> 文档不存在或被删除 </div> </div>
以下为可复制代码:

const app = createApp({ setup() { const loading = ref(false); const error = ref(null); const hasFile = ref(true); const onView = async (item) => { const iframe = document.getElementById('frameContainer'); if (!iframe) return; loading.value = true; error.value = ''; let img1 = '/temp/' + item.ImageFileName; const urls = [img1]; //传入一个或多个文件路径。 const results = await Promise.all(urls.map(checkFileExists)) hasFile.value = results[0]; if (hasFile.value) { iframe.src = img1; } } const checkFileExists = async (url) => { try { const res = await fetch(url, { method: 'HEAD', cache: 'no-store', }) return res.ok } catch (err) { return false } }; return { loading, error, hasFile, onView }; } }); app.mount('#app');
View Code
此内容由惯性聚合(RSS阅读器)自动聚合整理,仅供阅读参考。 原文来自 — 版权归原作者所有。