react小书没读完的记录

react的生命周期
constructor() 一般来说所有关于组建自身的状态的初始化工作都会放在 constructor里面去做

componentWillMount:组件挂在开始之前,也就是在组件调用render方法之前调用 进行组件的启动工作

例如Ajax数据拉取定时器的启动组件从页面上销毁的时候

componentDidMount:组件挂载完成以后，也就是DOM元素已经插入页面后调用componentWillUnmount:组件对应的DOM元素从页面中删除之前调用 有时候需要一些组件的清理 例如定时器的清理shouldComponentUpdate(nextProps,nextState) 可以通过这个方法控制组件是否重新渲染,如果返回false组件就不会重新渲染componentWillReceiveProps(nextProps) 组件从父组件接受到的新的props之前调用componentWillUpdate() 组件开始重新渲染之前调用componentDidUpdate() 组件重新渲染并且把更改变为真是的DOM之后调用

react on*事件监听只能用于普通的HTML标签上面不能用在组件标签上面

react 的事件监听方法需要手动bind到当前实例这种模式在react中非常常用

如果有多个setState对同一个属性进行操作比如累加后面的不能及时接收到前面的

更改过后的state的值这个时候应该在setstate里面接收一个函数来实现数据的及时变化

props可以通过在父组件的子组件标签上面传递对象函数来传给子组件子组件可以通过this.props

的方式来获取到父组件传递过来的参数也可以通过给组件添加类属性defaultProps来配置默认参数

props一旦传入就不可以在组件内部对他进行修改但是可以通过父组件主动重新渲染的方式(setstate)来传入新的props

从而达到更新的效果

ref属性是一个函数例如:<input ref={(input) => this.input = input} /> 这就是给input起了个input的名字然后穿进去赋值给this.input 然后

this.input 就代表这个input DOM节点了能不用ref尽量不用ref

state是让组件控制自己的状态 props是让外部对组件进行配置尽量少用state 多用props 没有state的组件叫做无状态组件

设置了state的组件叫有状态组件因为状态会带来管理的复杂性(个人理解就是不好被复用)所以应该尽量少写有状态的组件

react中必须要用setState才能更新组件的内容，所以要想在react中实现类似Vue中的输入框双向绑定就需要监听输入框的onchange

事件然后获取到用户输入的内容在通过setState的方式更新state中的跟输入框绑定的值这样输入框的内容才会更新

类似于这些元素的value值被react所控制渲染的组件在react中都成为受控组件对于用户可输入的

控件一般都可以让他们成为受控组件这是react所推崇的做法

dangerouslySetInnerHTML属性就相当于Vue里面的v-html react里面的style接收一个对象里面的带有-的属性要把-省略同时把-后面的字母大写

通过propTypes给组建的参数做类型限制可以帮助我们迅速定位错误这在构建大型应用程序特别有用

高阶组件就是一个函数传给他一个组件它返回一个新的组件这个新的组件会使用你传给他的组件作为子组件

子组件里面公用父组件的props属性这就是单向数据流当某个状态被多个组件依赖或者影响的时候就该把状态提升到这些组件的最近的

公共父组件中去管理，用props传递数据或者函数来管理这种依赖或者影响的行为但是如果一个组件的状态是跟他上面祖先的状态有联系的话

那么就得提升到祖先的那一级去这样不利于代码维护所以就有了Redux的诞生

react小书没读完的记录相关推荐

React.js 小书 Lesson18 - 挂载阶段的组件生命周期（一）
React.js 小书 Lesson18 - 挂载阶段的组件生命周期(一) 本文作者:胡子大哈本文原文:http://huziketang.com/books/react/lesson18 转载请注 ...
React.js 小书 Lesson12 - state vs props
React.js 小书 Lesson12 - state vs props 本文作者:胡子大哈本文原文:http://huziketang.com/books/react/lesson12 转载请注 ...
React.js 小书 Lesson14 - 实战分析：评论功能（一）
React.js 小书 Lesson14 - 实战分析:评论功能(一) 本文作者:胡子大哈本文原文:http://react.huziketang.com/blog/lesson14 转载请注明出处 ...
React.js 小书 Lesson27 - 实战分析：评论功能（六）
React.js 小书 Lesson27 - 实战分析:评论功能(六) 本文作者:胡子大哈本文原文:http://huziketang.com/books/react/lesson27 转载请注明出 ...
React.js 小书 Lesson5 - React.js 基本环境安装
React.js 小书 Lesson5 - React.js 基本环境安装本文作者:胡子大哈本文原文:http://huziketang.com/books/react/lesson5 转载请注明 ...
React.js 小书 Lesson15 - 实战分析：评论功能（二）
作者:胡子大哈原文链接: http://huziketang.com/books/react/lesson15 转载请注明出处,保留原文链接和作者信息. 上一节我们构建了基本的代码框架,现在开始完善 ...
React.js 小书 Lesson24 - PropTypes 和组件参数验证
作者:胡子大哈原文链接: http://huziketang.com/books/react/lesson24 转载请注明出处,保留原文链接和作者信息. 我们来了到了一个非常尴尬的章节,很多初学的朋 ...
React.js 小书 Lesson1-2 - 前端组件化（一）：从一个简单的例子讲起
React.js 小书 Lesson1-2 - 前端组件化(一):从一个简单的例子讲起本文作者:胡子大哈本文原文:http://huziketang.com/books/react/lesson2 ...
React.js小书总结
(迁移自旧博客2017 08 27) 第一阶段 react的组件相当于MVC里面的View. react.js 将帮助我们将界面分成了各个独立的小块,每一个块就是组件,这些组件之间可以组合.嵌套,就成 ...
面对500篇GNN论文，心态差点儿崩了，幸好我有这本小书
题图 | Computer vector created by stories - www.freepik.com 说起来,大学时代的图灵君也算得上是零挂科修完全部计算机课程的人才.怀着对前沿技术的满 ...

react小书没读完的记录

react小书没读完的记录相关推荐

最新文章

热门文章