Logo
☆☆☆☆☆
0.0
Intermediate
8h

使用 TypeScript 构建多态 React 组件

TypeScript 已成为构建现代 Web 应用的行业标准。随着设计系统和可复用组件的兴起,为现代 Web 工程师掌握构建强类型多态组件的能力变得尤为重要。 本课程采用自底向上的方法,教你如何构建强类型的多态组件。你将从一个简单的多态组件实现开始,分析其存在的问题。接着,利用 TypeScript 构建一个可用于生产环境的组件接口。最后,通过支持组件引用等高级用例,开发出一个可在多个组件中复用的实用工具。 完成本课程后,你将具备构建适用于设计系统的组件的能力,并超越基础的可复用需求。

5 Lessons
Included in Subscription Plan
Personalized Learning
Powered by AI
使用 TypeScript 构建多态 React 组件
TypeScript 已成为构建现代 Web 应用的行业标准。随着设计系统和可复用组件的兴起,为现代 Web 工程师掌握构建强类型多态组件的能力变得尤为重要。 本课程采用自底向上的方法,教你如何构建强类型的多态组件。你将从一个简单的多态组件实现开始,分析其存在的问题。接着,利用 TypeScrip...

WHAT YOU'LL LEARN

对中间级别的 TypeScript 工具类型和 TypeScript 泛型的理解

Content

5 Lessons • 0 Quizzes • 0 Challenges

简介
  1. 1

    关于多态组件

  2. 2

    Chakra UI 中的多态组件

  3. 3

    Material UI 中的多态组件

  4. 4

    构建一个多态组件

  5. 5

    简单实现的缺点

  6. 6

    多态组件元素属性

强类型多态组件
  1. 1

    TypeScript 泛型简介

  2. 2

    泛型约束

  3. 3

    使用泛型多态属性

  4. 4

    在 JSX 中处理泛型

  5. 5

    接收有效的 HTML 元素字符串

  6. 6

    处理有效的组件属性

  7. 7

    ComponentProps 类型

  8. 8

    处理多态属性的默认值

  9. 9

    引入一个可复用的组件属性

  10. 10

    强类型组件属性

  11. 11

    可复用组件属性

  12. 12

    测验

构建一个可重用的多态类型工具
  1. 1

    初探

  2. 2

    构建可重用的工具

  3. 3

    测验

支持 Ref 的多态组件
  1. 1

    支持 Ref 的组件属性

  2. 2

    多态引用类型

  3. 3

    强类型引用

  4. 4

    测验

练习与总结
  1. 1

    练习:构建一个支持多态的边框组件

  2. 2

    练习题解答

  3. 3

    结论

Certificate of Completion

Showcase your accomplishment by sharing your certificate of completion.

Course Author:Anonymous User

Reviews

Read reviews from students who have taken this course and share your own experience.

Reviews & Comments (0)