资讯专栏INFORMATION COLUMN

react知识点整理50问(未完待续)

wanghui / 1264人阅读

react知识点50问 1.react中的keys的作用

keys是react来追踪哪些元素被修改添加、删除的辅助标记

2.调用setState之后发生了什么

react会将传入的参数对象和组件的当前状态合并,根据新的状态构建新的react元素树,计算react新树和老树的差异,根据差异最小化对界面进行最小化渲染

3.react生命周期

初始化阶段:
getDeaultProps(获取实例的默认props)
getInitialState(获取每个实例的初始状态)
componentWillMount(组件即将被挂载、渲染到页面上)
render(组件在这生产虚拟DOM)
componentDidMount(组件被挂载后、一般在这里调用ajax请求)

运行阶段:
componentWillReceieveProps(组件要接受到属性的时候调用)
shouldComponentUpdate( 组件接受新的状态或者新的属性的时候;返回false,接受数据不更新,反之更新数据)
componentwillUpdate(组件即将更新)
render(组件更新)
componentDidUpdate(组件已经更新)

销毁状态:
componentWillUnMount(组件即将销毁)

以上是React v16前的生命周期,下面是新的生命周期

1565883383865

4.React中的refs是什么?

可以通过refs访问到dom元素,并对dom元素进行操作

5.react中展示组件和容器组件有什么不同

展示组件

主要负责组件内容如何展示

从props接受父组件传递来的数据

大多数可以通过函数定义组件声明
容器组件

主要关注组件数据如何交互

拥有自身state,从服务器获取数据,或与redux等其他数据处理模块写作

通过类定义组件声明,包含生命周期函数和其他附加方法

6. 为什么建议传递给setState的参数建议是一个callback而,不是对象?

因为this.props和this.state的更新是异步的。

7.类组件和函数式组件有何不同
区别 函数式组件 类组件
是否有this ×
是否有生命周期 ×
是否有state ×
8.状态state和props属性的区别

state是一种数据结构,用于组件挂载时所需数据的默认值,state可读可写

props是属性的意思,是由父组件传递给子组件的,对子组件来说props不可变。
props只读,state可读可写

9.受控组件

受控组件中的value值通过state获取,同时通过onChange事件改变state中的value,有这样特性 的 组件叫受控组件,反之,非受控组件通过refs操作真实DOM

10. 调用super(props)的目的

子类没有自己的this对象,只能通过调用super(props)拿到

11.react中如何配置多个代理

在package.jsson中向以下这种格式设置proxy

"proxy": {
  "/api/RoomApi": {
    "target": "http://open.douyucdn.cn",
    "changeOrigin":true
  },
  "/api/v1":{
    "target":"http://capi.douyucdn.cn",
    "changeOrigin":true
  }
}
12.react和vue的区别

react是单向数据流,只能通过setState的方法改变数据,vue中数据是响应式的,通过给每个属性建立watcher来监听,当属性发生变化,响应式的更新对应的虚拟dom。

react通过js操作一切,vue是把html、js、css写到一起,还是用各自的处理方式

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/116249.html

相关文章

  • react识点整理50未完待续

    react知识点50问 1.react中的keys的作用 keys是react来追踪哪些元素被修改添加、删除的辅助标记 2.调用setState之后发生了什么 react会将传入的参数对象和组件的当前状态合并,根据新的状态构建新的react元素树,计算react新树和老树的差异,根据差异最小化对界面进行最小化渲染 3.react生命周期 初始化阶段:getDeaultProps(获取实例的默认p...

    TIGERB 评论0 收藏0
  • 【半月刊 4】前端高频面试题及答案汇总

    摘要:引言半月刊第四期来啦,这段时间新增了道高频面试题,今天就把最近半月汇总的面试题和部分答案发给大家,帮助大家查漏补缺,欢迎加群互相学习。更多更全的面试题和答案汇总在下面的项目中,点击查看。引言 半月刊第四期来啦,这段时间 Daily-Interview-Question 新增了 14 道高频面试题,今天就把最近半月汇总的面试题和部分答案发给大家,帮助大家查漏补缺,欢迎 加群 互相学习。 更多更...

    hankkin 评论0 收藏0
  • 前端学习整理资料(未完待续

    摘要:前端月刊周刊文章百度前端圈奇虎团队规范妙趣课堂开发社区百度规范腾讯淘宝携程前端美团技术博客博客一峰老赵较旧旧深入理解系列安全相关页凹凸实验室前端开发规范携程文章浏览器是如何工作的英文前端代码规范及最佳实践 前端月刊:https://www.kancloud.cn/jsfro... 周刊文章http://ourjs.com/http://www.feweekly.com/issuesht...

    nodejh 评论0 收藏0
  • 前端学习整理资料(未完待续

    摘要:前端月刊周刊文章百度前端圈奇虎团队规范妙趣课堂开发社区百度规范腾讯淘宝携程前端美团技术博客博客一峰老赵较旧旧深入理解系列安全相关页凹凸实验室前端开发规范携程文章浏览器是如何工作的英文前端代码规范及最佳实践 前端月刊:https://www.kancloud.cn/jsfro... 周刊文章http://ourjs.com/http://www.feweekly.com/issuesht...

    csRyan 评论0 收藏0
  • 前端学习整理资料(未完待续

    摘要:前端月刊周刊文章百度前端圈奇虎团队规范妙趣课堂开发社区百度规范腾讯淘宝携程前端美团技术博客博客一峰老赵较旧旧深入理解系列安全相关页凹凸实验室前端开发规范携程文章浏览器是如何工作的英文前端代码规范及最佳实践 前端月刊:https://www.kancloud.cn/jsfro... 周刊文章http://ourjs.com/http://www.feweekly.com/issuesht...

    lastSeries 评论0 收藏0

发表评论

0条评论

wanghui

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<