全国旗舰校区

不同学习城市 同样授课品质

北京

深圳

上海

广州

郑州

大连

武汉

成都

西安

杭州

青岛

重庆

长沙

哈尔滨

南京

太原

沈阳

合肥

贵阳

济南

下一个校区
就在你家门口
+
当前位置:首页  >  应聘面试  >  html5面试题

react组件的概念(高阶组件,受控组件,非受控组件)

发布时间:2022-11-16 17:07:16
发布人:syq

  高阶组件: 高阶组件(HOC)是 React 中用于复用组件逻辑的一种高级技巧。HOC 自身不是React API的一部分,它是一种基于React的组合特性而形成的设计模式。

react组件的概念

  一、属性代理

  1. 属性代理是最常见的实现方式,它本质上是使用组合的方式,通过将组件包装在容器组件中实现功能。

  2. 属性代理方式实现的高阶组件和原组件的生命周期关系完全是React父子组件的生命周期关系,所以该方式实现的高阶组件会影响原组件某些生命周期等方法。

  操作props抽象state获取refs引用获取原组件的static方法通过props实现条件渲染

  二、反向继承

  反向继承指的是使用一个函数接受一个组件作为参数传入,并返回一个继承了该传入组件的类组件,且在返回组件的render()方法中返回super.render() 方法,最简单的实现如下:

  受控组件

  1. 受控组件通过props获取其当前值,并通过回调函数(比如onChange)通知变化

  2. 表单状态发生变化时,都会通知React,将状态交给React进行处理,比如可以使用useState存储

  3. 受控组件中,组件渲染出的状态与它的value或checked属性相对应

  4. 受控组件会更新state的流程非受控组件,非受控组件将数据存储在DOM中,而不是组件内,这比较类似于传统的HTML表单元素。

  5. 非受控组件的值不受组件自身的state和props控制

  6. 非受控组件使用ref从DOM中获取元素数据

相关文章

前端公司面试题——jquery移除class

2023-08-07

前端JavaScript面试题——js时间戳转换时间的方法

2023-08-04

前端中JavaScript常见的面试题——js年月日转为时间戳

2023-08-02

前端jquery面试题——jquery字符串包含哪些?

2023-08-01

前端JavaScript面试题——js如何创建函数?

2023-07-31

前端程序员面试题——jquery发送get请求的步骤

2023-07-28
在线咨询 免费试学 教程领取