代码封装问题

来源：12-9 【redux连接】完成在线支付

慕粉4283821

2021-03-21

老师，课程到这里，发现很多页面中的代码都是相似的，有什么办法能进一步的封装吗。。

比如：

import { useSelector } from "../../redux/hooks";
import { useDispatch } from "react-redux";
import { useHistory } from "react-router";

const dispatch = useDispatch();
const jwt = useSelector((s) => s.user.token) as string;

像这种代码基本上在每个页面都会写的

写回答

1回答

阿莱克斯刘

2021-03-22

首先我们需要排除的方法是class的继承，因为react文档明确说明了，组件不可以继承。但是我们可以通过HOC的方法实现对页面组件的封装。因为我们使用的是typesciript，所以我们甚至可以更进一步，使用decrator装饰器来对HOC进行封装，让我们的代码更简单。

React18 系统精讲结合TS打造旅游电商平台

React18 精讲 + 结合 TS 实战 + 热门业务开发，获取必备技能

1993 学习 · 1015 问题

查看课程

相似问题

这个地方怎么使用自己封装的axios呢不使用裸代码的形势怎么使用呢?

回答 1

babel-jest 版本问题运行不了项目

回答 2

代码格式问题

回答 2

代码照着敲跑不起来

回答 2

老师，这段代码的讲解听不懂

回答 1

打开慕课网App查看更多内容