TypeScript 开发实战
梁宵
搜狗营销事业部高级架构师
34174 人已学习
新⼈⾸单¥59
课程目录
已完结/共 47 讲
TypeScript 开发实战
登录|注册
留言
11
收藏
沉浸
阅读
分享
手机端
回顶部
当前播放: 34 | 组件与类型(2):高阶组件与Hooks
00:00 / 00:00
高清
  • 高清
1.0x
  • 2.0x
  • 1.5x
  • 1.25x
  • 1.0x
  • 0.75x
  • 0.5x
网页全屏
全屏
00:00
付费课程,可试看
01 | 重塑“类型思维”
02 | 类型基础(1):强类型与弱类型
03 | 类型基础(2):动态类型与静态类型
04 | 编写你的第一个TypeScript程序
05 | 基本类型
06 | 枚举类型
07 | 接口(1):对象类型接口
08 | 接口(2):函数类型接口
09 | 函数相关知识点梳理
10 | 类(1):继承和成员修饰符
11 | 类(2):抽象类与多态
12 | 类与接口的关系
13 | 泛型(1):泛型函数与泛型接口
14 | 泛型(2):泛型类与泛型约束
15 | 类型检查机制(1):类型推断
16 | 类型检查机制(2):类型兼容性
17 | 类型检查机制(3):类型保护
18 | 高级类型(1):交叉类型与联合类型
19 | 高级类型(2):索引类型
20 | 高级类型(3):映射类型
21 | 高级类型(4):条件类型
22 | ES6与CommonJS的模块系统
23 | 使用命名空间
24 | 理解声明合并
25 | 如何编写声明文件
26 | 配置tsconfig.json(1):文件选项
27 | 配置tsconfig.json(2):编译选项
28 | 配置tsconfig.json(3):工程引用
29 | 编译工具:从ts-loader到Babel
30 | 代码检查工具:从TSLint到ESLint
31 | 使用Jest进行单元测试
32 | 创建项目
33 | 组件与类型(1):函数组件与类组件
34 | 组件与类型(2):高阶组件与Hooks
35 | 事件处理与数据请求
36 | 列表渲染与路由
37 | Redux与类型
38 | 搭建服务端开发环境
39 | 列表的CRUD
40 | 导出Excel
41 | 搭建Vue开发环境
42 | 组件封装
43 | 组件发布
44 | 共存策略
45 | 宽松策略
46 | 严格策略
47 | 结课测试&结束语
本节摘要
登录 后留言

全部留言(11)

  • 最新
  • 精选
Hurry
关于高阶组件的问题 ```ts import React from 'react'; function Hello() { return <p>Hello</p> } interface Loading { loading: boolean } function HelloHOC<P>(WrappedComponent: React.ComponentType<P>) { return class extends React.Component<P extends Loading> { render() { const { loading, ...props } = this.props; return loading ? <p>loading</p> : <WrappedComponent {...props as P}/> } } } export default HelloHOC(Hello); ``` 为什么不能使用 P extends Loading 而是 P & Loading

作者回复: 泛型约束只能用在泛型函数或泛型类的定义中,这里的 Component 已经是实现了,需要传入一个类型,P extends Loading 不是一种类型。

2019-08-21
2
2
AICC
泛型p是组件的属性类型?看着更像是组件本身的类型 组件类型和组件的属性类型有什么区别

作者回复: React 组件类型的定义是: type ComponentType<P = {}> = ComponentClass<P> | FunctionComponent<P> 可为一个类类型,也可为一个函数类型 P 则是组件的 props,是一个对象类

2021-05-05
极客大白
老师请教一个问题,我这里运行HOC时浏览器会报语法错误:Uncaught SyntaxError: Unexpected token ... 这段代码const {loading, ...props} = this.props;

作者回复: 这一行并不能看出问题,看看其他地方是否有语法错误

2020-03-21
2
fy
老师,按照你的这章最后模板写的,咋显示界面全是白体黑字?CSS样式问题?还是使用后面会讲?

作者回复: 没明白啥是白体黑字,你运行的是哪个例子,HOC?Hooks?还是最后的表单查询界面?看看有没有报错,GitHub上也有代码,对比一下。

2019-08-27
11
郭超Charles
如果用config-overrides.js重写react的配置的话,需要在package.json里把启动命令里的react-scripts前缀 改成 react-app-rewired 否则启动后界面没有样式。
2021-02-22
2
渣渣辉
谢谢老师!讲的很通俗易懂
2023-12-03
Its me
这里HOC的P,是怎么自动被推导成Greeting 类型的?没看懂,能解释一下吗老师
2023-09-18
新雨~丞^AQUA
function HelloHOC<P>(WrappedComponent: React.ComponentType<P>) { return class extends Component<P & Loading> { render() { const { loading, ...props } = this.props; return loading ? <div>Loading...</div> : <WrappedComponent { ...props as P } />; } } } Type 'P' is not assignable to type 'IntrinsicAttributes & P & { children?: ReactNode; }'. Type 'P' is not assignable to type 'IntrinsicAttributes'. TS2322 14 | } 15 | } 16 | } 这什么报错 因为时间太久了 版本的问题吗?
2022-12-13
1
代罔
遇到网页持续闪烁,页面黑白没有样式的同学,需要在index.tsx中全局引入antd的css样式
2021-06-06
1
流花
不会react这个实战,看起来确实难懂,只能从思维模式上去抽象理解。只有看后面的vue了
2019-12-31
收起评论