vue Iframe
1.Iframe.vue
<!-- Iframe -->
<template>
<div>
<!-- 标题栏 -->
<mt-header title="Iframe">
<router-link to="/" slot="left">
<mt-button icon="back">返回</mt-button>
</router-link>
</mt-header>
<!-- 内容 -->
<iframe
:src="currentSrc"
frameborder="0"
scrolling=""
style="background-color:transparent; position: absolute; z-index: -1; width: 100%; height: 100%; top: 40px;left:0;">
</iframe>
</div>
</template> <script>
export default {
name: 'Iframe',
data(){
return {
currentSrc: "https://www.cnblogs.com/"
}
}
}
</script> <style lang="less" scoped>
/*隐藏 滚动条*/
::-webkit-scrollbar{
display:none;
}
</style>
2.效果图

vue Iframe的更多相关文章
- vue iframe嵌套单页面时打开新窗口并自定义浏览器标题
vue打开新窗口两种写法,效果一样: 第一种: router-link 传参用query或者params都可以,tagget和tag一定要加上才可以: 第二种: 直接写成a标签就可以了. 改变浏览器窗 ...
- vue iframe嵌套页面高度自适应 (ios 宽度扩大的bug , ios展示比例问题)
<template> <div class="card-index pt-relative"> <div id="wrapper ...
- iframe 父页面调用子页面的vue方法
父页面代码: html: <div id="app"> //省略业务代码x行..... <iframe sr ...
- VUE 导出Excel(iframe)
1. 概述 1.1 说明 在开发过程中,有时候需要导出某数据表格(excel)以便客户使用,使用iframe对返回二进制文件进行下载处理.记录此功能,以便后期使用. 2. 示例 2.1 vue示例代码 ...
- iframe嵌套vue页面打开新窗口
iframe嵌套vue页面时目录结构为下图: 此时出口文件指向index.html, 所以只需要用a标签动态拼接href, 并设置属性 target="_blank" ,即可在if ...
- vue中嵌套页面 iframe 标签
vue中嵌套iframe,将要嵌套的文件放在static下面: <iframe src="../../../static/bear.html" width="300 ...
- JS 互相调用iframe页面中js方法、VUE里 iframe 互调方法
1,父 html 调用子 iframe 内方法: document.getElementById("iframe").contentWindow.func(data1,data2. ...
- vue 之 加载 iframe 的处理
vue中加载 iframe 会出现跨域问题.以及iframe的高度自适应问题,以下是本人的解决办法: getGoodsContentHtml---- 你的iframe页面的地址, 如不同域的情况下 ...
- vue中嵌套页面(iframe)
vue中嵌套iframe,将要嵌套的文件放在static下面.(要将打包文件整体放在statici里,我的文件名是canvas) src可以使用相对路径,也可使用服务器根路径http:localhos ...
随机推荐
- C++派生类继承父类修饰符
公式: 继承成员对外的访问属性 = Max{继承方式,父类成员访问级别}: 1.如果子类从父类继承时使用的继承限定符是public,那么(1)父类的public成员成为子类的public成员,允许类以 ...
- log4j.xml 精选的log4j.xml文档,比较详细,网上的版本很多,这个版本相对而言比较完整
<?xml version="1.0" encoding="UTF-8"?><!DOCTYPE log4j:configuration PUB ...
- PHP18 PHP与AJAX
学习要点 JavaScript实现Ajax jQuery实现Ajax JSON PHP的JSON函数 JavaScript处理JSON数据 JavaScript实现Ajax 什么是Ajax 搜狗地图 ...
- spring boot 在idea中实现热部署
1)在pom中直接引入依赖 <dependency> <groupId>org.springframework.boot</groupId> <artifac ...
- 解决 【xshell 5 不能使用退格键和Delete建】的问题
###按照图片操作即可 1,打开[文件],选择[打开]选项 2.在会话中,打开[属性] 3.点击左边[终端]下的[键盘]选项,按照如下设置 即可.
- 我的Python分析成长之路1
Python是什么? ...
- Java并发编程:用AQS写一把可重入锁
Java并发编程:自己动手写一把可重入锁详述了如何用synchronized同步的方式来实现一把可重入锁,今天我们来效仿ReentrantLock类用AQS来改写一下这把锁.要想使用AQS为我们服务, ...
- ZOJ 2588 求割边问题
题目链接:http://vjudge.net/problem/viewProblem.action?id=14877 题目大意: 要尽可能多的烧毁桥,另外还要保证图的连通性,问哪些桥是绝对不能烧毁的 ...
- [luoguP1772] [ZJOI2006]物流运输(DP + spfa)
传送门 预处理cost[i][j]表示从第i天到第j天起点到终点的最短距离 f[i]表示前i天到从起点到终点的最短距离 f[0] = -K f[i] = min(f[i], f[j - 1] + co ...
- [USACO13NOV]空荡荡的摊位Empty Stalls
题目描述 Farmer John's new barn consists of a huge circle of N stalls (2 <= N <= 3,000,000), numbe ...