世界上最伟大的投资就是投资自己的教育
import React, { Component, PureComponent } from 'react';
import logo from './logo.svg';
import './App.css';
class Temp extends PureComponent {
render() {
console.log('render Temp');
return (
<div>{ this.props.val }</div>
);
}
}
class App extends Component {
state = {
val: 1
}
componentDidMount() {
setInterval(() => {
this.setState({
val: 1
})
}, 2000)
}
// shouldComponentUpdate(nextProps, nextState) {
// console.log('nextState', nextState);
// console.log('current state', this.state);
// return (
// this.state.val === nextState.val ? false : true
// )
// }
render() {
console.log('render App');
return (
<div className="App">
<header className="App-header">
<img src={logo} className="App-logo" alt="logo" />
<h1 className="App-title">Welcome to React</h1>
</header>
<p className="App-intro">
To get started, edit <code>src/App.js</code> and save to reload.
</p>
<Temp val={ this.state.val } />
</div>
);
}
}
export default App;
07:141FreeReact 技巧 #1 如何用 netlify 云服务部署 React 应用
05:342FreeReact 技巧 #2 把 React 应用部署到 GitHub Pages
10:293FreeReact 技巧 #3 React-router 教程 part 1
07:394FreeReact 技巧 #4 React-router 教程 part 2
04:52FreeReact 进阶提高免费视频教程 #5 React.PureComponent
02:366FreeReact 进阶提高免费视频教程 #6 Fragment
03:587FreeReact 进阶提高免费视频教程 #7 context(上下文)
02:518FreeReact 进阶提高免费视频教程 #8 高阶组件
08:209FreeReact 进阶提高免费视频教程 #9 强大酷炫好玩的 web IDE 工具(鼠标点击生成代码,缩减 N 倍开发时间)
05:5810FreeReact 进阶提高免费视频教程 #10 用高阶组件来重构代码
04:3011FreeReact 进阶提高免费视频教程 #11 我最爱的 React 库 - 功能强大的可插入组件(简化代码)
03:0712FreeReact 进阶提高免费视频教程 #12 返回多个组件的正确方式
06:4913FreeReact 进阶提高免费视频教程 #13 netlifyctl 一键部署前端应用
06:3714FreeReact 进阶提高免费视频教程 #14 defaultProps 和 类型检查 PropTypes part 1
09:5715FreeReact 进阶提高免费视频教程 #15 类型检查 PropTypes part 2
11:0816FreeReact 进阶提高 #16 用 Render Props 代替 HOC(高阶组件)
11:4517FreeReact 进阶提高免费视频教程 #17 错误边界和生命周期函数 componentDidCatch
02:3718FreeReact 进阶提高免费视频教程 #18 升级到 16.3
03:5019FreeReact 进阶提高免费视频教程 #19 探索 bind (this) 的写法
06:5020FreeReact 进阶提高免费视频教程 #20 React 16.3 全新的 Context API
09:1921FreeReact 进阶提高免费视频教程 #21 React 16.3 全新的 Context API - 实践
11:3722FreeReact 进阶提高免费视频教程 #22 从 Redux 迁移到 React 16.3 的 Context API 之实践
06:1023FreeReact 进阶提高免费视频教程 #23 对象,数组,可变数据
06:0624FreeReact 进阶提高免费视频教程 #24 React.Children API 和 props.children 讲解
04:5625FreeReact 进阶提高免费视频教程 #25 如何使用 styled-components
07:2926FreeReact 进阶提高免费视频教程 #26 如何使用 styled-components(实践篇)
06:4027FreeReact 进阶提高免费视频教程 #27 你应该使用 redux-form(介绍)
10:3428FreeReact 进阶提高免费视频教程 #28 你应该使用 redux-form(实践篇)
08:5229FreeReact 进阶提高免费视频教程 #29 React Portals(学习方法)
04:2130FreeReact 进阶提高免费视频教程 #30 使用 React Portals 实现 Modal 框(part 1)
07:2631FreeReact 进阶提高免费视频教程 #31 使用 React Portals 实现 Modal 框(part 2)
04:3832FreeReact 进阶提高免费视频教程 #32 使用 React Portals 实现 Modal 框(part 3)
05:3033FreeReact 进阶提高免费视频教程 #33 使用 React Portals 实现 Modal 框(part 4)
▬▬▬▬▬▬ 联系我 👋 ▬▬▬▬▬▬
微信:qiuzhi99pro
b 站:https://space.bilibili.com/31152817
知乎:https://www.zhihu.com/people/rails365
Github:https://github.com/hfpp2012
Youtube:https://www.youtube.com/channel/UCA-Jkgr40A9kl5vsIqg-BIg
© 汕尾市求知科技有限公司 | 创业者社区 | Rails365 Gitlab | Qiuzhi99 Gitlab | Railstart 创业项目 | 知乎 | b 站 | 搜索
粤公网安备 44152102000088号
| 粤ICP备19038915号
componentDidMount() {
setInterval(() => {
this.setState({
val: 1
})
}, 2000)
}
//为什么会有这种需求
动态统计图了解一下?