vscode中iframe由于某种原因不支持本地页面,比如<iframe src ="index.html" width="300" height="300"></iframe>这样的。

但是支持远程网络地址,比如像<iframe src ="https://www.baidu.com" width="300" height="300"></iframe>

其实我最不想使用的就是iframe,最符合我实际需要的仅仅是location.href,但是vscode内部不支持location.href,所以我只能采取iframe,但是使用iframe,我需要写大量的js来控制,觉得这种实现很不好。

由此我突发一个设想,为了解决目前的业务需要,我有两个想法:

第一、就通过iframe里面嵌入外网地址,外网地址项目由后台人员编写,这样的话,有些功能是可以复用的便于效率的提高;

第二、既然vscode中的webview只能支持单页面,那么我可以采用现在业界的SPA开发(单页面应用)。

忘记补充一点:iframe如果嵌入本地的界面,会出现空白,但是从浏览器上打开却显示正常,换成网络地址就都没有问题。

由于某种原因上述两个想法实现起来可能所需的时间不满足现在的快速迭代,只能暂时延后,不过呢,我还是要记录一下,说不定其他的小伙伴会需要。

关于SPA(vue.js应用实例)可以参考vue.js菜鸟教程:https://www.runoob.com/vue2/vue-routing.html

vscode中iframe的使用的更多相关文章

  1. 在vscode中使用Git

    用了git最方便的就是比如在公司写了很多代码后回到家打开vscode只需要点击一下pull就能全部同步过来.是不是很方便....毕竟之前我都是拿u盘拷贝回家或者存到云盘再下载下来.. 我这里用的是国内 ...

  2. vscode中使用markdown

    vscode中使用markdown vscode 是微软推出一款轻量级的文本编辑工具,类似于sublime,由于其拥有丰富的插件,安装使用也非常简单,所以深受广大程序员的喜爱. markdown 是一 ...

  3. 在VSCode中编辑HTML文档时,在Dom标签上写style属性时智能提示的问题

    首先在VSCode中打开一个HTML文件 然后点右下角的“选择语言模式” 然后点击配置HTML语言的基础设置 然后在打开的界面中(右侧) 输入如下代码 { "editor.quickSugg ...

  4. 解决忽略VScode中Python插件pylint报错的问题

    pylint是VScode中python自带的插件,可以帮助代码规范,美观. 但是有些报错是你不想看到的,你可以选择性的忽略. 例如,在re.compile()中,可以添加参数re.S使. 匹配任意字 ...

  5. v-for 在 VSCode 中出现 Elements in iteration expect to have 'v-bind:key' directives.

    在 VSCode 中编辑代码时,在有 v-for 的语句下面有一条红色波浪线,鼠标放上去有提示 Elements in iteration expect to have 'v-bind:key' di ...

  6. VScode中python环境配置

    vscode中python环境配置 想要在vscode中运行python代码必须要告诉vscode使用哪个解释器才行 方法1. 打开命令面板(Ctrl+Shift+P)输入Python: Select ...

  7. vscode中使用markdown(转)

    vscode 是微软推出一款轻量级的文本编辑工具,类似于sublime,由于其拥有丰富的插件,安装使用也非常简单,所以深受广大程序员的喜爱. markdown 是一种可以使用普通文本编辑器编写的标记语 ...

  8. vscode中配置php的xdebug

    vscode中配置php的xdebug vscode配置php的xdebug,步骤如下: 1. 安装phpdebug插件: PHP Debug 2.网上下载php的xdebug扩展(注意根据自己的ph ...

  9. vscode中php断点调试方法!

    一.PHP的代码断点调试 1.打开vscode的首选项设置,添加"php.validate.executablePath": "D:\\newXampp\\php\\ph ...

随机推荐

  1. 通向全栈之路(6)—无密码ssh连接

    (1)在用户目录下新增一个 .ssh文件 mkdir .ssh (2)生成公钥.私钥 ssh-keygen -t rsa -b 4096 -C "mail@xxx.com" (3) ...

  2. C# 基础运算符及运算

    本节主要讲述运算符的分类及其实际运用 运算符 分类 符号 解释 优先级 算数 ++  -- 加加(加1)  减减(减1) 由高到低,即执行顺序由上到下(圆括号的优先级最高) *  /  % 乘  除  ...

  3. [android] 手机卫士接收短信指令执行相应操作

    通过广播接收者,接收到短信,对短信内容进行判断,如果为我们指定的值就执行相应的操作 如果短信内容是”#*location*#” 就执行,获取手机位置 如果短信内容是”#*alarm*#” 就执行,播放 ...

  4. link标签链接CSS和@import加载的区别

    link:基本语法 <link rel="stylesheet" href="路径"> @import 基本语法 <style> @im ...

  5. 【读书笔记】iOS-使用蓝牙

    蓝牙是由Sony Ericsso公司研发出来的,它是一种无线通讯协议,主要用于短程和低耗电设备,其有效通讯范围约30ft,传输速度为1MB/s.与Wifi设计初衷不同,蓝牙适用于无线的外围设备,进行小 ...

  6. Linux环境下运行简单java程序

    一.安装java 1.下载jdk8 登录网址:http://www.oracle.com/technetwork/java/javase/downloads/jdk8-downloads-213315 ...

  7. Android spinner默认样式不支持换行和修改字体样式的解决方法

    在spinner中显示的数据过多,需要换行,而Android自身提供的android.R.layout.simple_spinner_dropdown_item样式不支持换行,因此参考android提 ...

  8. [软件逆向]实战Mac系统下的软件分析+Mac QQ和微信的防撤回

      0x00  一点废话 最近因为Mac软件收费的比较多,所以买了几款正版软件,但是有的软件卖的有点贵,买了感觉不值,不买吧,又觉得不方便,用别人的吧,又怕不安全.于是我就买了正版的Hopper Di ...

  9. charles系列破解激活办法(最高charles4.2都可以激活)

    // Charles Proxy License // 适用于Charles任意版本的注册码,谁还会想要使用破解版呢. // Charles 4.2目前是最新版,可用.   Registered Na ...

  10. EntityFramework Code-First 简易教程(十)-------多对多

    配置Many-to-Many(多对多)关系: 这里有两个类,Student和Course,一个Student可以有多个Course,一个Course也可以有多个Student,所以这就成了多对多关系. ...