vue3项目利用iframe展示其他页面
在Vue 3项目中，你可以使用<iframe>标签来展示其他页面。以下是一个基本的示例：
- 在你的Vue组件中，添加
<iframe>标签，并设置src属性为你想展示的页面的URL。
<template>
<div>
<iframe
:src="iframeUrl"
width="100%"
height="600"
frameborder="0"
allowfullscreen
></iframe>
</div>
</template>
<script>
export default {
data() {
return {
iframeUrl: 'https://example.com', // 替换为你想展示的页面URL
};
},
};
</script>- 确保目标页面允许被其他域（domain）的iframe嵌入。如果目标页面没有设置适当的CORS策略，可能会遇到跨域问题。
- 如果你需要在iframe和父页面之间传递数据，可以使用
window.postMessageAPI。
确保你的Vue 3项目满足任何必要的跨域请求策略，如果iframe加载的页面与父页面不同源，你可能需要配置代理来绕过同源策略。
评论已关闭