阅读 205

react的思维导图

一、react介绍

wecom-temp-32246bbb088bcef371bc1fd65ce5378b.png

二、UI界面

2.1 JSX基础

wecom-temp-4253d108d36ae4bb2b2ee045e8cdeaa5.png

2.2 数据渲染

wecom-temp-730849989bf179689ff554e0e86d7038.png

wecom-temp-e4d053949c39c001df4dba23ed3c7ff1.png

三、React与React Redux

3.1 React

wecom-temp-e99fb1b25ff5516a5ea8e6b867c4f895.png

wecom-temp-1bf53014072ed72bb4e21ab6e901b4e0.png

3.2 React Redux

wecom-temp-b98eb575727b0026abef33cd4793a70c.png

四、组件

4.1 组件化思想

wecom-temp-8202695f5e8c529ae6b6b9eded7eb37b.png

4.2 类组件

wecom-temp-c7b44d760bc2bd08c376e9a84f79e58f.png

wecom-temp-d0728449aabd216af43d982eef84cec0.png

wecom-temp-bfecce6bf7e4417daf796a0dd6f85c76.png

wecom-temp-db596d0c6b5a7505523b9f5fe9e17086.png

4.3 函数组件

wecom-temp-17a677b066ffeddc13e16393af747751.png

wecom-temp-834e7fe37d8a0cfc77baa0f40a016354.png

wecom-temp-c229804bea095ceeec864a73490ebaeb.png

wecom-temp-ad491d1e650aa62508450dcf16a0da8b.png

wecom-temp-2c9c90c297c55cac33edc8f9eed18d3a.png

wecom-temp-2c9c90c297c55cac33edc8f9eed18d3a.png

wecom-temp-49f6d503079f40809e2e8b31c337b1ba.png

4.4 高阶组件

wecom-temp-55f6c4980486e7912bd4f56b209837fc.png

学习完一个技术框架,使用思维导图可以加深记忆,一边写一边理解,整挺好的复制代码

借鉴  微信公众号:前端点线面--一张思维导图入门React


作者:木子星辰
链接:https://juejin.cn/post/7068958844818620424


文章分类
代码人生
版权声明:本站是系统测试站点,无实际运营。本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至 XXXXXXo@163.com 举报,一经查实,本站将立刻删除。
相关推荐