npm i jqueryimport $ from 'jquery';GET方法：
$.ajax({
url: url,
type: "GET",
data: {
},
dataType: "json",
success: function (resp) {
},
});POST方法：
$.ajax({
url: url,
type: "POST",
data: {
},
dataType: "json",
success: function (resp) {
},
});Route组件：npm i react-router-domBrowserRouter：所有需要路由的组件，都要包裹在BrowserRouter组件内Link：跳转到某个链接，to属性表示跳转到的链接Routes：类似于C++中的switch，匹配第一个路径Route：路由，path属性表示路径，element属性表示路由到的内容useParams 和 useSearchParams 获取路径参数Navigate：和Route组件组合使用来实现重定向import { BrowserRouter } from 'react-router-dom';在root.render()中用<BrowserRouter></BrowserRouter>将App组件（或者自己定义的其他有使用路由的组件）括起来。
例如
<BrowserRouter>
<App />
</BrowserRouter>import { Link } from 'react-router-dom';将页面内部跳转所用到的<a href="..."></a> 改为 <Link to="..."></Link>，其他保持不变
import {Routes, Route} from 'react-router-dom';先写一个<Routes></Routes>标签，然后在里面写<Route />标签
其中<Route /> 标签中有两个参数一个是path另外一个是element，path中放匹配的路径，element中放要渲染的标签
例如
<Routes>
<Route path='/' element={<Home />}/>
<Route path='like' element={<Like />}/>
<Route path='about' element={<About />}/>
<Route path='issues' element={<Issues />}/>
</Routes>element中不仅可以放组件的标签，正常的html标签也可以放
例如：
<Routes>
<Route path='/' element={<h1>Hello world</h1>}/>
</Routes><Route path="/web" element={<Web />}>
<Route index path="a" element={<h1>a</h1>} />
<Route index path="b" element={<h1>b</h1>} />
<Route index path="c" element={<h1>c</h1>} />
</Route>注意：需要在父组件中添加<Outlet />组件，用来填充子组件的内容。（即<Outlet />会根据路由的不同动态的渲染不同的子标签，假如当前的路由为/web/a 则<Outlet />等效于<h1>a</h1>）
解析URL：
<Route path="/linux/:chapter_id/:section_id/" element={<Linux />} />获取参数，类组件写法：
import React, { Component } from 'react';
import { useParams } from 'react-router-dom';
class Linux extends Component {
state = { }
render() {
console.log(this.props.params);
return <h1>Linux</h1>;
}
}
export default (props) => (
<Linux
{...props}
params={useParams()}
/>
)函数组件写法：
import React, { Component } from 'react';
import { useParams } from 'react-router-dom';
const Linux = () => {
console.log(useParams());
return (<h1>Linux</h1>);
}
export default Linux;类组件写法：
import React, { Component } from 'react';
import { useSearchParams } from 'react-router-dom';
class Django extends Component {
state = {
searchParams: this.props.params[0], // 获取某个参数
setSearchParams: this.props.params[1], // 设置链接中的参数，然后重新渲染当前页面
}
handleClick = () => {
this.state.setSearchParams({
name: "abc",
age: 20,
})
}
render() {
console.log(this.state.searchParams.get('age'));
return <h1 onClick={this.handleClick}>Django</h1>;
}
}
export default (props) => (
<Django
{...props}
params={useSearchParams()}
/>
);函数组件写法：
import React, { Component } from 'react';
import { useSearchParams } from 'react-router-dom';
const Django = () => {
let [searchParams, setSearchParams] = useSearchParams();
console.log(searchParams.get('age'));
return (<h1>Django</h1>);
}
export default Django;import {Routes, Route, Navigate} from 'react-router-dom';<Route path="*" element={ <Navigate replace to="/404" /> } />redux将所有数据存储到树中，且树是唯一的。
store：存储树结构。state：维护的数据，一般维护成树的结构。reducer：对state进行更新的函数，每个state绑定一个reducer。传入两个参数：当前state和action，返回新state。action：一个普通对象，存储reducer的传入参数，一般描述对state的更新类型。dispatch：传入一个参数action，对整棵state树操作一遍。
Provider组件：用来包裹整个项目，其store属性用来存储redux的store对象。connect(mapStateToProps, mapDispatchToProps)函数：用来将store与组件关联起来。
mapStateToProps：每次store中的状态更新后调用一次，用来更新组件中的值。mapDispatchToProps：组件创建时调用一次，用来将store的dispatch函数传入组件。npm i redux react-redux @reduxjs/toolkit在定义store的jsx中导入，当然如果是写在一个文件中就没关系
import { configureStore } from "@reduxjs/toolkit";在main.jsx/index.jsx中导入Provider
import { Provider } from 'react-redux';在每一个需要使用到redux全局变量的组件内部导入connect
import { connect } from 'react-redux';可以单独写一个文件，中放一个对象的全局变量来存actions
reducer是一个函数，需要传入两个参数，一个是state，另外一个是action
action是一个对象，state是当前存的数据，需要赋一个初值
例如：
const reducer = (state="0", action) => {
switch(action.type) {
}
};state同时可以维护一个对象，此时reducer可以这样写
const reducer = (state={
currentOperand: "",
lastOperand: "",
operation: "",
}, action) => {
switch(action.type) {
default:
return state;
}
};const store = configureStore({
reducer: reducer
});store 和两个reducer的名称可以任意，自己知道就行。
这里reducer和reducer重名，可以只写一个reducer来表示reducer: reducer
例如：
const store = configureStore({
reducer
});在main.jsx/index.jsx中将有使用redux的组件用<Provider></Provider>括起来，同时需要给Provider传一个参数store，就是我们定义的store
例如：
<Provider store={store}>
<BrowserRouter>
<App />
</BrowserRouter>
</Provider>将dispatch函数绑定到组件上
例如：
const mapDispatchToProps = {
add_digit: digit => {
return {
type: ACTIONS.ADD_DIGIT,
digit: digit,
}
}
}例如：
export default connect(null, mapDispatchToProps)(DigitButton);之后就可以通过 this.props.add_digit 来使用add_digit函数了
将state数据绑定到组件上
例如：
const mapStateToProps = (state, props) => {
return {
currentOperand: state.currentOperand,
lastOperand: state.lastOperand,
operation: state.operation,
}
}例如
export default connect(mapStateToProps)(Calculator);之后就可以通过 this.props. ...来访问state中的数据了
npm i bootstrap在main.jsx中引入
import 'bootstrap/dist/css/bootstrap.css';
import 'bootstrap/dist/js/bootstrap.js';现在是晚上9点多，在实验室。明明到了期末应该是要复习的时候，但是就是不想复习。也没有什么要做的事情。本来想学一学算法或者看一看前端，但是都看不下去也就算了。
想到昨天晚上，在实验室里，看到了以前初中同学给我发了一照片，问我眼不眼熟，是一张被隔板档住了三分之二的脸。只剩下了一双眼睛。我看了看，想着要怎么回。
最后憋出了一句”这是XXX吗？“
微信那边的同学回了简短的两个字，是的。
看着聊天框，好像一下子变得沉默了。
我又思索了下，问我同学，有打招呼吗？
他说有，我说，挺好的。
我关掉了窗口，盯着电脑的封面，眼前一下子什么都看不到了，整个人沉浸在回忆的动作里。努力会想起那段时间带给我的种种感受。不清楚好的剩下了多少，也不敢计较不好的又还占着多少的记忆。
一个提示声打断了我的回忆，电脑状态栏绿泡泡不断地闪烁，是我的同学。
同学说对方想和我打招呼。我下意识想点视频，后来发现，还是不敢见面，尽管只是顺着网线而已。整理了下情绪，我故意回道，电话吗？好好。
一段时间，手机响起。我最后是在实验室外面的广场上接的电话。
电话那边各种声音不断，一下子冲击着我的大脑，让我有点晕呼呼的。
一个熟悉的声调，自话筒里面传出来，在嘈杂的环境声中显得有点不真切。
我努力地听着，对面的人只是简单的打着招呼，我做了简单的回应。
我跟她说我在哪里读书，过的很好。说我什么时候放假，最后的最后承诺会回去看看的。
电话终止于我的两句祝福，元旦快乐，新年快乐。
我叹了口气，盯着远处的草坪，光秃秃了一片。防风林遮住了大半的天空，是蓝色的。
我居然忘记了问她过的如何。现在还是在教书吧。我一直不是很想回忆我的初中班主任，对她的情感很复杂，有感激，有愧疚，最后离别时，竟少了一句道别。
少了的那句道别终于是在昨天用元旦快乐的话语补上了。
可能以后再也见不到了。
谢谢您的栽培，我现在过的很好，希望您也过得很好，新年快乐，老师。