const Page: React.FC = () => {
const { id, name } = useParams
();
console.log('id:', id)
console.log('name:', name)
注：页面路径参数格式为，path/:id
路由routes设置：{ name: '带参页面', path: '/page/:id&:name'}跳转：history.push(`/page/${id}&${name}`)路由routes设置：{ name: '带参页面', path: '/page/:id&:name'}获取参数：import { useParams } from 'react-router-dom';const Page: React.FC = (
路由
参数
假如我们有很多 list
页面
，这些
页面
除了动态内容不同，其他的
页面
部分都相同，这个时候需要怎么配置路由和组件呢？
这种场景就需要用到路由的
参数
功能，增加一条包含
参数
的路由配置。
import List from './component/list';
注意 path 属性中的 :id 就是该路由的
参数
（ param ）。再来看看 List
页面
的组件。
/list 对应了 list.
js
import
React
from '
react
';
class List extends
React
.
为什么要用
HOOK
S
复用一个有状态的组件太麻烦
react
都核心思想是，将一个
页面
拆成一堆独立的，可复用的组件，并且用自上而下的单向数据流的形式将这些组件串联起来。但假如你在大型的工作项目中用
react
，你会发现你的项目中实际上很多
react
组件冗长且难以复用。尤其是那些写成class的组件，它们本身包含了状态（state），所以复用这类组件就变得很麻烦。
那之前，官方...
页面
能够实时刷新，归根结底是用了定时器的原理
1. 用setTimeout直接实现 ->
react
hook
s-
页面
实时刷新（setInterval）
2. 用封装好的
hook
函数实现 （
use
Request）
use
Request 轮询通过设置 options.pollingInterval，进入轮询模式，
use
Request是一个强大的异步数据管理的
Hook
s。
，创建
react
项目：
router
_app。默认使用当前
react
的最新版本：
react
@18、
react
-dom@18。
，默认下载安装最新版本r：
react
-
router
-dom@6。涉及的文件包括：
入口文件index.
js
routes/index.
js
入口组件App.
js
pages/Home/index.
js
x（Home组件）
pages/About/index.
js
x（About组件）
pages/News/index.
js
x（News组件）
pages/Message/inde
React
入门学习笔记（7）
react
router
中的
参数
获取
Brower
Router
Query
参数
获取
Param
参数
获取
Brower
Router
要使用
react
router
，要在最外层包裹一层
Router
,
react
-
router
-dom中的
router
有很多种，具体的可以去看官方文档，最常用的是Brower
Router
。
import * as
React
from "
react
";
import * as
React
DOM from "
react
-dom";
import { Browse
react
中通过dom元素属性
获取
参数
的方法
我们在平时开发中遇到一个列表展示很多内容，然后点击列表中的某一项进行操作时需要
获取
当前项数据的
参数
，一般来说都是使用事件函数直接传参的方式进行
获取
，今天记录另一种通过dom元素自身属性
获取
参数
的方式。
1、通过事件函数传参
首先来看下通过事件回调函数进行的传参方式，完整代码如下：
import
React
from '
react
'
const dataList = [
id: 1,
name: '小明',
React
是一个用于构建用户界面的 JavaScript 库。起源于 Facebook 的内部项目，并与2013年5月开源。
React
拥有较高的性能，代码逻辑非常简单，越来越多的人已开始关注和使用它
