PengPeng1020的博客

原创 redux原理图

原创 react新版本的生命周期钩子用法

getDerivedStateFromProps()会在render之前调用，并且会在初始页面也后续更新时都会调用，若返回一个对象则会更新state，若返回null也不做任何更新。当state在任何时刻都取决于props时可以在该钩子中对props和state进行对比判断，因为可以接受props和state两个参数。当state的值依赖props时需要使用当前钩子函数。static getDerivedStateFromProps(props, state){ console.log('getD.

原创 react组件之间的订阅发布

利用Pubsub-js包进行组件之间（包括兄弟组件、远亲组件）的数据传递import Pubsub from 'pubsub-jsclass A extends React.Component { Pubsub.publish('myData',data) render(){ return ( <div></div> ) }}---------------------------------------------import Pubsub from '

原创 react生命周期钩子

原创 react中ref的三种形式

字符串形式（不推荐）class Demo extends React.Component { showDate = () => { const {input1} = this.refs alert(input1.value) } showData2 = () => { const {input2} = this.refs alert(input2.value) } render(){ <div> <input ref='input1'/&g.

原创 react中constructor构造器的使用

react的constructor构造器中的使用在react类组件内使用constructor构造器一般两种用途，应在其他语句之前使用super(props)，否则在构造器内若要获取this.props会出现未定义。对state状态进行初始赋值在constructor内不应使用setState来改变state，应直接对this.state进行赋值class Person extends React.Components { constructor(props){ super(props)