1. 代码库的构建应专注于 <>JSX 部分</>
- JSX 部分在发布后经常需要修改。
- 将数据获取部分与视图部分分离。
// 不好🤔 你无法直观地理解重点。
const Area = () => {
const [user, setUser] = useState();
useEffect(() => {
const fetchUser = async (): Promise<void> => {
const response = await GetUser();
setUser(response);
};
fetchUser();
}, []);
return <>{user.name}</>;
};
// 好😎 将数据获取部分与视图部分分离。
const useUser = (): User | undefined => {
const [user, setUser] = useState<User>();
useEffect(() => {
const fetchUser = async (): Promise<void> => {
const response = await GetUser();
setUser(response);
};
fetchUser();
}, []);
return user;
};
// 用于显示数据的组件。
const Area =<
免责声明:本文内容来自互联网,该文观点不代表本站观点。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容,请到页面底部单击反馈,一经查实,本站将立刻删除。