m0_57809042的博客

React UI组件库

React Router 以三个不同的包发布到 npm 上，它们分别为：react-router: 路由的核心库，提供了很多的：组件、钩子。包含react-router所有内容，并添加一些专门用于 DOM 的组件，例如等。等。与React Router 5.x 版本相比，改变了什么？内置组件的变化：移除，新增等。变为等。useParamsuseMatch等。官方明确推荐函数式组件了！！！......

​ 路由链接(携带参数)：详情。​ 借助this.prosp.history对象上的API对操作路由跳转、前进、后退this.prosp.history.push()name=tom&age=18’}>详情。​ 路由链接(携带参数)：详情。

fetch: 原生函数，不再使用XmlHttpRequest对象提交ajax请求。下载: npm install pubsub-js --save。React本身只关注于界面, 并不包含发送ajax请求的代码。前端应用需要通过ajax请求与后台进行交互(json数据)（1）jQuery: 比较重, 如果需要另外引入不建议使用。react应用中需要集成第三方ajax库(或自己封装)在package.json中追加如下配置。（2）axios: 轻量级, 建议使用。老版本浏览器可能不支持。常用的ajax请求库。

切换到想创项目的目录，使用命令：create-react-app hello-react。react提供了一个用于创建react项目的脚手架库: create-react-app。，全局安装：npm i -g create-react-app。使用脚手架开发的项目的特点: 模块化, 组件化, 工程化。，进入项目文件夹：cd hello-react。实现静态组件: 使用组件实现静态页面效果。（2）交互(从绑定事件监听开始)拆分组件: 拆分界面,抽取组件。（1）动态显示初始化数据。

在package.json中追加如下配置。

需求:定义一个包含表单的组件输入用户名密码后,点击登录提示输入信息用受控组件方式写：5.2 理解包含表单的组件分类受控组件非受控组件高阶函数：如果一个函数符合下面2个规范中的任何一个，那该函数就是高阶函数​ 1.若A函数。接收的参数是一个函数，那么A就可以称之为高阶函数​ 2.若A函数，调用的返回值依然是一个函数，那么A就可以称之为高阶函数​ 常见的高阶函数有：Promise、setTimeout、arr.map()等等函数的柯里化：通过函数调用继续返回函数的方式，实现多次

类式组件注意组件名必须首字母大写虚拟DOM元素只能有一个根元素虚拟DOM元素必须有结束标签2 组件实例的三大核心属性1.state2.1 练习需求:定义一个展示天气信息的组件1. 默认展示天气炎热 或 凉爽2. 点击文字切换天气简写形式2.2 理解state是组件对象最重要的属性, 值是对象(可以包含多个key-value的组合)组件被称为"状态机", 通过更新组件的state来更新对应的页面显示(重新渲染组件)组件中render方法中的this为组件实例对象组件自定义的

（1）若小写首字母。则将该标签转为html中同名元素，若html中无该标签对应的同名元素，则报错。遇到 <开头的代码, 以标签的语法解析: html同名标签转换为html同名元素, 其它标签需要特别解析。（2）若大写字母开头，react就去渲染对应的组件，若组件没有定义，则报错。遇到以 { 开头的代码，以JS语法解析: 标签中的js表达式必须用{ }包含。babel.min.js：解析JSX语法代码转为JS代码的库。当应用的js都以模块来编写的, 这个应用就是一个模块化的应用。