无法访问iframe地址

index.js文件

import React from 'react';
import ReactDOM from 'react-dom';
import App from './App'; ReactDOM.render(<App />, document.getElementById('root'));

App.js

import React from 'react'

class App extends React.Component {
render() {
return (
<div>
<h1>Outside iFrame</h1>
<iframe title="myiframe" src="./target.html" width="600px" height="400px"></iframe>
</div>
)
}
} export default App

target.html

<html>

<head></head>

<body>
<h1>Inside IFrame</h1>
</body> </html>

index.html

<div id="root"></div>

为什么引入的是

<iframe title="myiframe" src="./target.html" width="600px" height="400px"></iframe>

如何在react里嵌入iframe?的更多相关文章

  1. [Web 前端] 如何在React中做Ajax 请求?

    cp from : https://segmentfault.com/a/1190000007564792 如何在React中做Ajax 请求? 首先:React本身没有独有的获取数据的方式.实际上, ...

  2. session失效后,登录页面嵌入iframe框架

    在登录页面的onload方法中加入以下代码解决: //防止登录页面嵌入iframe框架 if (top.location != self.location){ top.location=self.lo ...

  3. 在JavaScript里嵌入大量字符串常量的方法

    [转]在JavaScript文件里嵌入大量字符串常量是经常遇到的事.有时为了省事,就把一些界面的HTML和CSS直接写在JS文件里.数量少还好,多的话就密密麻麻的一坨文字,讲究美观的文艺青年们,会用大 ...

  4. 响应式嵌入 iframe Pym.js

    Pym.js 可以让你在嵌入 iframe 的时候可自动的对 iframe 的大小进行调整以适应父一层容器,并且可以避免跨域问题. 支持浏览器: Internet Explorer 9, 10 (Wi ...

  5. 【Egret】里使用iframe标签达到内嵌多个web界面

    目的:Egret里使用iframe标签达到内嵌多个web界面,模式相当于主swf调用N个子swf的效果: 目前在做项目过程中,在使用iframe的时候,碰到了一些功能需求,以及解决方法如下: 一..在 ...

  6. 如何在BIOS里设置定时关机?

    如何在BIOS里设置定时关机? 通过CMOS设置实现定时开机的设置过程如下: 首先进入"CMOS SETUP"程序(大多数主板是在计算机启动时按DEL键进入): 然后将光条移到&q ...

  7. 模拟vue的tag属性,在react里实现自定义Link

    我封装了一个简单的实现react里自定义Link的方法,方便大家使用. 因为普通组件没有metch.location.history等属性.只有在<Router>里面的<compon ...

  8. 如何在IDEA里给大数据项目导入该项目的相关源码(博主推荐)(类似eclipse里同一个workspace下单个子项目存在)(图文详解)

    不多说,直接上干货! 如果在一个界面里,可以是单个项目 注意:本文是以gradle项目的方式来做的! 如何在IDEA里正确导入从Github上下载的Gradle项目(含相关源码)(博主推荐)(图文详解 ...

  9. [转]如何在 Git 里撤销(几乎)任何操作

    任何版本控制系统的一个最有的用特性就是“撤销 (undo)”你的错误操作的能力.在 Git 里,“撤销” 蕴含了不少略有差别的功能. 当你进行一次新的提交的时候,Git 会保存你代码库在那个特定时间点 ...

随机推荐

  1. Linux改变文件属性与权限

    chgrp:改变文件所属用户组 chown:改变文件所有组 chmod:改变文件的权限 一.chgrp(change group的简称) 修改文件所属组:eg:chgrp users install. ...

  2. Oracle 日期加减运算

    -- Start 我们都知道数字可以进行加.减.乘.除等运算.那么,日期可不可以呢?答案是,日期只能进行加.减运算. 在开始操作日期之前,我们先了解一下 Oracle 支持哪些日期数据类型,如下所示: ...

  3. Python -函数的参数定义

    一.函数的参数有四种,位置参数.默认参数.可变参数和关键字参数 def func(x, y=0, *arg, **args): '''x为位置参数 y有默认值 *arg为可变参数 **args为关键字 ...

  4. 使用筛法在 O(logN) 的时间内查询多组数的素数因子

    Prime Factorization using Sieve O(log n) for multiple queries 使用筛法在 O(logN) 的时间内查询多组数的素数因子 前言 通常, 我们 ...

  5. Linux中的/etc/nologin问题

    /etc/nologin 文件给系统管理员提供了在 Linux 系统维护期间禁止用户登陆的方式. 如果系统中存在 /etc/nologin 文件那么普通用户登陆就会失败. 这是一种提高安全性和防止数据 ...

  6. javascript中的作用域与作用域链

    前几天,在写一段js代码时,出现了一些问题,调了很长时间也没有调通,其原因是,我在处理变量的作用域时错误地沿用了C++的作用域机制.因此我回炉了一次. 如果你使用过C++或java等一系列的面向对象的 ...

  7. data-ng-app 指令

    1.data-ng-app指令定义了一个AngularJS应用程序的根元素. 2.data-ng-app会在页面加载完毕后自动进行初始化应用程序. 3.data-ng-app可以通过一个值连接到代码模 ...

  8. Visual Studio Code快捷键_Linux

    Keyboard shortcuts for Linux Basic editing Ctrl + X Cut line(empty selection) Ctrk + C   Copy line(e ...

  9. Linux更改ssh端口号,很easy!

    因为公司业务需求,可能涉及到更改ssh远程的端口号,用下面方法轻松解决,废话不多说! 1.打开ssh端口配置文件:vim /etc/ssh/sshd_config,找到如下图所示的端口,改为自己想改的 ...

  10. 学习JavaScript一些资料时,记录一些规范小记

    最近工作不是很忙,所以再深入学学JavaScript,顺便提升一下自己,嘿嘿!主要记录一下学习到的一下编写代码的规范小记吧! 1.声明变量时一定带上var,避免一些错误发生,如变量提升时遇见的问题发生 ...