chevron_left

React 实践教程

免费
第 4.15 回

教程文档

React 实践教程 - 路由总结

2023年12月20日
React 实践教程

路由总结

创建 React 项目

npm create vite@latest demo -- --template react

安装 React Router

新建好 React 项目以后,

yarn add install react-router-dom localforage match-sorter sort-by
yarn dev

配置路由示例

修改src/main.jsx

import React from "react"
import ReactDOM from "react-dom/client"
import {
  createBrowserRouter,
  RouterProvider,
} from "react-router-dom";

// 布局模板
import Root from "./routes/layouts/root.jsx";

// 错误页
import ErrorPage from "./routes/error...

课程介绍

「长乐未央」出品的 React 开发教程。

React 是用于构建用户界面的 JavaScript 库,起源于 Facebook 的内部项目,因为该公司对市场上所有 JavaScript MVC 框架,都不满意,就决定自己写一套,用来架设 Instagram 的网站。做出来以后,发现这套东西很好用,就在 2013 年 5 月开源了。

由于 React 的设计思想极其独特,属于革命性创新,性能出众,代码逻辑却非常简单。所以,越来越多的人开始关注和使用,认为它可能是将来 Web 开发的主流工具。

这个项目本身也越滚越大,从最早的 UI 引擎变成了一整套前后端通吃的 Web App 解决方案。衍生的 React Native 项目,目标更是宏伟,希望用写 Web App 的方式去写 Native App。如果能够实现,整个互联网行业都会被颠覆,因为同一组人只需要写一次 UI,就能同时运行在服务器、浏览器和手机。

React 主要用于构建 UI。你可以在 React 里传递多种类型的参数,如声明代码,帮助你渲染出 UI、也可以是静态的 HTML DOM 元素、也可以传递动态变量、甚至是可交互的应用组件。

  1. 声明式设计:React 采用声明范式,可以轻松描述应用。
  2. 高效:React 通过对 DOM 的模拟,最大限度地减少与 DOM 的交互。
  3. 灵活:React 可以与已知的库或框架很好地配合。

适合这样的人

有一定开发基础,最好之前学过Vue的同学