![[已复活]](/views/front/img/head.png){kind=avatar}
vue-element-admin内嵌html页面
1）第一种，留取左侧路由菜单栏 （以iframe内嵌的形式嵌入html文件）
此种方法可保留左侧菜单和上方面包屑
1.src/router/index.js添加左侧菜单路由，（博客内有添加路由的方法）
2.src/views添加对应的路由跳转页面
3.在该页面添加
export default {
data() {
return {
htmlSrc: 'xxx.html' //该页面在public文件夹下
}
}
}2）第二种，不考虑左侧菜单和上部面包屑。跳转页面占全屏,只保留最上部标题和下部导航栏
1.在src/views下创建文件夹public，并创建index.vue页面
2.找到router.js，其内添加路由：
{
path: '/xxx',
//component: Layout //该方法与上面方法的区别就在于这里，
//Layout是全局框架，组件不含Layout。添加路由后所import的页面就不会在框架内，而是占据全屏
component: () => import('@/views/public/index')
},3.在index.vue页面内嵌html：
export default {
data() {
return {
htmlSrc: 'xxx.html'
}
}
}若想对其封装
1）在src/components/phone下新建一个IframeHtml.vue页面
该页面存放内嵌html的一些标签属性
2）div内加上标签