无法访问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命令之添加权限Chmod的使用

    chmod是change mode的缩写,是修改文件权限的一个命令: 一个文件分别有三组权限:用户拥有者,用户组 第一个横杆-表示文件,如果是d表示目录.还有可能是l,表示链接. 第一组(rw-)表示 ...

  2. mybatis返回boolean值时数据库返回null

    Servlet.service() for servlet [springDispatcherServlet] in context with path [/ms] threw exception [ ...

  3. CentOS 7.0 各版本下载说明 新增Everything版

    CentOS-7.0-1406有很多可供选择的版本,对初学者来说,不知如何选择,下面做简单的介绍: CentOS-7.0-1406-x86_64-DVD.iso 标准安装版,一般下载这个就可以了 Ce ...

  4. IOS 设置ipone状态栏的样式

    /** 控制状态栏的样式 */ -(UIStatusBarStyle)preferredStatusBarStyle { //白色 return UIStatusBarStyleLightConten ...

  5. C#自定义规则对比两个集合的对象是否相等

    IList<获取的类> ret = 类的结果集; return ret.Except(另一个相同类型的对象列表集, new AClassComPare()): public class A ...

  6. 软件的依赖关系:类图关系：is-a has-a use-a

    基本描述: 类图关系:is-a has-a use-a: 依赖规则: 依赖倒置: 依赖注入: 接口隔离: 无环依赖: 稳定依赖: 依赖倒置描述: 底层抽象-->高层抽象 ^          ^ ...

  7. 模拟网页的浏览Stack(POJ1028)

    题目链接:http://poj.org/problem?id=1028 注意: 1.用两个栈来模拟,一个用来存可以返回的,一个用来存可以前进的. 2.visit方法,就要将可以前进的栈清空. 3.ba ...

  8. G711格式语音采集/编码/转码/解码/播放

    2019-05-01 语音g711格式和AMR格式类似,应用很简单,很多人已经整理过了,收录于此,以备不时之需,用别人现成的足矣,我们的时间应该用来干更有意义的事. 1.PCM to G711 Fas ...

  9. Python实现接口测试中的常见四种Post请求数据

    前情: 在日常的接口测试工作中,模拟接口请求通常有两种方法, 利用工具来模拟,比如fiddler,postman,poster,soapUI等 利用代码来模拟,使用到一些网络模块,比如HttpClie ...

  10. vector的几种初始化和遍历

    随着C++11标准的出现,vector出现了新的初始化和遍历用法,但是vs2010和较高版本并没有能完全支持C++11标准,所以我就将它的所有的用法归纳了一下. vector的初始化 vector基本 ...