@kevanbin 别点我星星了，44 几个 edge 消息弹窗和标签页

不能看英文的看什么英文，能看英文的当然尽量看英文，如果是浅尝辄止只是观望的内容中文文档自然是快捷

搞定是搞定了，看上去是蛮怪的，首先是不能引用 d.ts 里现成的 type 类型用，齐次，参数还得显式的都实现一遍，duration 和 type

```react

import React, { ReactNode } from 'react'
import { Card, Button, message } from 'antd'
// import { MessageApi, ArgsProps } from 'antd/lib/message'
import './ui.less'

interface MessageApi {
info: "info",
success: "success",
error: "error",
warn:"warn",
warning: "warning",
loading: "loading",
// open:"open",
// config:"config",
// destroy:"destroy"
}

export default class MessagesPages extends React.Component {

showMessage = (type: keyof MessageApi) => {
message[type]({ content: "测试文本", type: type, duration: 3 });
}

render() {
return (
<div>
<Card title="全局提示框" className="card-wrap">
<Button type="primary" onClick={() => this.showMessage('success')}>Success</Button>
<Button type="primary" onClick={() => this.showMessage('info')}>Info</Button>
<Button type="primary" onClick={() => this.showMessage('warning')}>Warning</Button>
<Button type="primary" onClick={() => this.showMessage('error')}>Error</Button>
<Button type="primary" onClick={() => this.showMessage('loading')}>Loading</Button>
</Card>
</div>
);
}
}



```

这标题太有那味了

#2 更正 webgl

1. 研究研究 webpack 、parcel 这些打包的和 ts ？
我忙 react 的，之前一直搞的 jsx 最近闲下来就看看 ts 了，照着个 jsx 的实战视频边实践用 ts 改写成 tsx 项目了。

2. vue 完全熟了就看看 react 或者 angular 的 ？(看个人学习路线规划)

3. 摸鱼逛逛社区看看有什么可以借鉴的奇淫技巧。
比如这个《如何用一行 CSS 分别实现 10 种现代布局？》 https://juejin.im/post/5f058bef6fb9a07eac0665fb

4. canvas 、webgal 、svg 这些我是屡败屡战了，啃不动 orz

5.有空就逛逛淘宝看看有没有盗录的新鲜便宜视频买买了，真的好加上经济允许或者需要“售后”我倒也会去支持“正版”的。
有些人喜欢视频掺和电子书一起看，虽然我说不上喜欢，也和上面视频一下搞了堆电子书(非正)，闲下来就混起来看看了。
——免责声明，本人并不是提倡盗版只是个人经济管理能力低下或手头经常没有余裕(逃


es 的书的话，经常能看见 v 友推荐《 You-Dont-Know-JS 》和《 JavaScript 编程精解》
之前也 v 友安利过“前端开发入门最佳指南” https://github.com/zhyd1997/zhyd1997.github.io/issues/1

看上去 nianyu 辩论输了开始拉着 shuangya 一起降级

感谢两位辩论的老哥带给我更多的知识

@feichao 非常感谢，render 确实能解决这个问题。
orz 顺着这个方向我查查去

v 站氪了 30，发现能存 49 张，上面的图片转存一下（虽然本帖价值不高。。。），才发现现在贴图库只给存 7 天
https://i.v2ex.co/859SH5C5.png
https://i.v2ex.co/F5M6POfS.png
https://i.v2ex.co/iItAv1X1.png
https://i.v2ex.co/mT599QTg.png
https://i.v2ex.co/3OMLWP4v.png
https://i.v2ex.co/Yq3CE1qU.png

@rioshikelong121 jsrun 的有个 demo （指水印功能）
http://jsrun.net/9t2Kp

上面 render 有些变量没来得及删，这是个上面安排得给别人擦屁股得项目，看上去上一位为了规避一些 bug 同样使用了一些怪招。笔者修改前，这儿得二级路由还是在用户点击菜单传值时才配置路由，现在采用得法子是登陆后全都配置好（有点好奇。。。笔者觉得这个才是正常思维来着）

@ccraohng

那儿也就一个配置路由的操作来着
```
import React,{Component} from "react";
import {Switch,Route,Redirect,withRouter} from 'mirrorx';

import HomeContainer from "Pages/Home/HomeContainer"
import PerconContainer from "Pages/Person/personContainer"
import MainFrame from "./MainFrame"

class ChildRoute extends Component{
constructor(props){
super(props);

this.state={
pathname_list:[]
}
}
componentWillMount(){

let pathname_list = JSON.parse(sessionStorage.getItem("url_routes"));
if(pathname_list){
// console.log("有了有了")
this.setState({pathname_list})
}else{
// console.log("我没有")
}



}

render(){
const redirectUrl = JSON.parse(sessionStorage.getItem("url"));
const userInfo = sessionStorage.getItem("userInfo");
const user = sessionStorage.getItem("user");
const url = "/main/"+redirectUrl;
const {match} = this.props;
const token = sessionStorage.getItem("TOKEN");
const src = redirectUrl+"?user="+user+"&token="+token;



return(
token==null?(
<Redirect to="/login"/>
) :
(
<Switch>
<Route exact path={'/main'} component={HomeContainer} breadcrumbName="首页" />
<Route exact path={'/main/person'} component={PerconContainer} />

{this.state.pathname_list.length!==0&&this.state.pathname_list.map(item=>
<Route exact path={'/main/'+item.part} key={item.all} component={()=><MainFrame fullsrc={item.all+"?user="+user+"&token="+token}/>}/>
)}

</Switch>
)
)
}
}
export default withRouter(ChildRoute)

```

这次的尝试曾使我一度怀疑是在父组件 componentDidMount 部署浏览器窗口的尺寸的监听与更新 screenHeight 所导致的（虽然没什么道理，只是在使用了 memo+useState 后比较是否有什么不同时发现——改变浏览器窗口尺寸也会触发 iframe 中内容的刷新，但是在父子组件两处都注释了这个监听器后改变尺寸刷新依旧。this.props.children 看起来同时也规避了这处问题）