最后
开源分享:【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】
就答题情况而言,第一问100%都可以回答正确,第二问大概只有50%正确率,第三问能回答正确的就不多了,第四问再正确就非常非常少了。其实此题并没有太多刁钻匪夷所思的用法,都是一些可能会遇到的场景,而大多数人但凡有1年到2年的工作经验都应该完全正确才对。
只能说有一些人太急躁太轻视了,希望大家通过此文了解js一些特性。
并祝愿大家在新的一年找工作面试中胆大心细,发挥出最好的水平,找到一份理想的工作。
一、创建React项目
常见的创建React项目有很多种方式,这里介绍两种,都是使用命令提示符,也就是cmd。
1、使用 creat-react-app
首先:全局安装create-react-app
npm install -g create-react-app
然后,创建React项目,–typescript是指创建tsx文件。
create-react-app your-project-name --typescript
2、使用 npm init vite
npm init vite
回车之后,会让你进行选择,编辑 y 输入,之后会让你输入项目名称,项目所使用的语言,然后项目就会自动生成。
二、使用Router路由
本文采用 npm init vite 的方式创建react项目。
首先需要在package.json中添加 react-router-dom 的依赖,在项目目录的cmd中,使用 npm install react-router-dom 命令进行安装依赖。
代码结构如下:
--> system
main --> app --> router --> home
--> user
项目初次运行时使用 npm run dev 命令。
main.tsx
import React from 'react'
import ReactDOM from 'react-dom/client'
import App from './App.tsx'
import { BrowserRouter } from 'react-router-dom' // 需要使用 BrowserRouter 进行包裹
import './index.css'
ReactDOM.createRoot(document.getElementById('root')!).render(
<React.StrictMode>
<BrowserRouter>
<App />
</BrowserRouter>
</React.StrictMode>,
)
app.tsx
import { useRoutes } from 'react-router-dom'
import { router } from './routers'
import './App.css'
function App() {
const outlet = useRoutes(router); // 使用 useRoutes
return (
<div>
{outlet}
</div>
)
}
export default App
router.tsx (导出router路由对象数组的作用)
import Home from "../views/home";
import User from "../views/user";
import System from "../views/system";
import { Navigate } from 'react-router-dom';
export const router = [
{
path: '/',
element: <Navigate to='/home' /> // 使用重定向
},
{
path: '/home',
element: <Home />
},
{
path: '/user',
element: <User />
},
{
#### 最后
**[开源分享:【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】](https://bbs.csdn.net/forums/4304bb5a486d4c3ab8389e65ecb71ac0)**
就答题情况而言,第一问100%都可以回答正确,第二问大概只有50%正确率,第三问能回答正确的就不多了,第四问再正确就非常非常少了。其实此题并没有太多刁钻匪夷所思的用法,都是一些可能会遇到的场景,而大多数人但凡有1年到2年的工作经验都应该完全正确才对。
只能说有一些人太急躁太轻视了,希望大家通过此文了解js一些特性。
并祝愿大家在新的一年找工作面试中胆大心细,发挥出最好的水平,找到一份理想的工作。