1. import * as React from 'react'
  2. import { Layout } from 'antd';
  3. import creatHistory from 'history/createHashHistory' //返回上一页这段代码
  4. const history = creatHistory();//返回上一页这段代码
  5. import './index.less'
  6. const { Header, Sider, Content } = Layout;
  7. export interface IProps {
  8. test?: any
  9. history?:any
  10.  
  11. }
  12. interface IState {
  13.  
  14. }
  15. export default class ReachInfos extends React.Component<IProps, IState> {
  16. constructor(props: IProps) {
  17. super(props)
  18. }
  19. goBackPage = () => {
  20. history.goBack(); //返回上一页这段代码
  21.  
  22. }
  23. render(){
  24. return (
  25. <div className="videoDetail">
  26. <Layout>
  27. <Header>
  28. <div className="headTitle">
  29. <span onClick={this.goBackPage} className="goBack"> <返回 </span>
  30. <span className="title">视频详情</span>
  31. </div>
  32. </Header>
  33. <Layout>
  34. <Sider>
  35. <h4>视频信息:</h4>
  36.  
  37. <ul>
  38. <li>拍摄时间:</li>
  39. <li>2018-10-11</li>
  40. </ul>
  41. <ul>
  42. <li>拍摄地址:</li>
  43. <li>雁塔区</li>
  44. </ul>
  45.  
  46. </Sider>
  47. <Content>
  48. <iframe src="http://gbs.liveqing.com:10000/play.html?serial=34020000001110000033&code=34020000001320000101&aspect=fullscreen" width="100%" height="360" allow="autoplay; fullscreen"></iframe>
  49. {/* <video autoPlay controls width="100%" src="https://media.w3.org/2010/05/sintel/trailer_hd.mp4"></video> */}
  50. </Content>
  51. <Sider>Sider</Sider>
  52. </Layout>
  53.  
  54. </Layout>
  55. </div>
  56. )
  57. }
  58. }

  

react 返回上一页的更多相关文章

  1. html中返回上一页的各种写法【转】

    超链接返回上一页代码: <a href="#" onClick="javascript :history.back(-1);">返回上一页</ ...

  2. JS控制,返回上一页之后强行刷新一次

    网站建设过程中,提交页面后我们经常要用到window.history.go(-1)返回上一页,因为页面的缓存功能,我们只能返回上次操作的页面,但在删除等操作中,我们希望实时看到删除项目后的页面,这就要 ...

  3. php实现返回上一页的功能

    php实现返回上一页的功能的3种有效方法 header(location:你的上一页的路径);   //   注意这个函数前不能有输出      header(location:.getenv(&qu ...

  4. 6种方法实现asp.net返回上一页

    其实要实现返回上一页的功能,主要还是要用到JavaScript. 一: 在ASP.net的aspx里面的源代码中 <input type="button onclick="J ...

  5. [moka同学收藏]网页上的“返回上一页”的几种实现代码

    我们在制作网页的时候,经常在网页上要用到"返回上一页"的功能.这一功能在制作网页的时候会有多种编码方法,在此,笔者将比较常用的几种编码写作方法在下面列出来,供各位技术人员参考使用. ...

  6. angular+ionic返回上一页并刷新

    假定当前页面为editCata页面,要返回的是cataDetail页面.目前我找到两种方法实现返回上一页并刷新,如果以后有其它方法,再继续添加. 1.在editCataCtrl.js中注入$ionic ...

  7. js返回上一页并刷新的多种实现方法

    <a href="javascript:history.go(-1)">返回上一页</a> <a href="javascript:loca ...

  8. JavaScript返回上一页代码区别

    JavaScript返回上一页代码区别: window.history.go(-1); //返回上一页 window.history.back(); //返回上一页 //如果要强行刷新的话就是:win ...

  9. JS跳出框架返回上一页

    链接部分 <a class="link" href="javascript:;" target="_top" onclick=&quo ...

随机推荐

  1. Java Web项目开发中常见路径获取方法

    项目绝对路径 String serverPath = request.getSession().getServletContext().getRealPath("/"); E:\J ...

  2. Python extensions for Windows

    Python extensions for Windows pywin32 214 Python extensions for Windows Maintainer: Mark Hammond Hom ...

  3. MATLAB——matlab特殊符号表【转载】

    链接来源: matlab特殊符号表 http://blog.sina.com.cn/s/blog_4a09187801014xg9.html Character Sequence Symbol Cha ...

  4. YTU 2635: P4 游戏中的Human角色

    2635: P4 游戏中的Human角色 时间限制: 1 Sec  内存限制: 128 MB 提交: 524  解决: 328 题目描述 在一个平面打斗游戏中,任何的角色(Role)都有血量(bloo ...

  5. POJ 3650:The Seven Percent Solution

    The Seven Percent Solution Time Limit: 1000MS   Memory Limit: 65536K Total Submissions: 7684   Accep ...

  6. 分享一个全开源的ASP.NET快速开发平台,能快速开发OA CRM ERP 等系统

    bingo炸了 2017/3/30 16:28:14 阅读(870) 评论(0) 公司业务量比较大,接了很多项目,为了缩短开发周期老板让我牵头搭建了一个快速开发平台. 我们主要的业务是做OA.CRM. ...

  7. BZOJ_1576_[Usaco2009 Jan]安全路经Travel&&BZOJ_3694_最短路_树链剖分+线段树

    Description Input * 第一行: 两个空格分开的数, N和M * 第2..M+1行: 三个空格分开的数a_i, b_i,和t_i Output * 第1..N-1行: 第i行包含一个数 ...

  8. python-----列表生成式和列表生成器表达

    列表表达式: 程序一: 常规写法: L = [] for x in range(1, 11): L.append(x * x) print(L) #[1, 4, 9, 16, 25, 36, 49, ...

  9. 2-5 原生小程序 - 语法缺点.mp4

  10. Linux 下安装配置 JDK7(转载)

    转自:http://dawndiy.com/archives/155/ 自从从Oracle收购Sun近三年来,已经有很多变化.早在8月,甲骨文将“Operating System Distributo ...