# 实训二淦

**Repository Path**: chang_xu_yang/score

## Basic Information

- **Project Name**: 实训二淦
- **Description**: 远赴人间惊鸿宴，一睹人间盛世颜，奥利给
- **Primary Language**: JavaScript
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2020-08-14
- **Last Updated**: 2020-12-19

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# 后台管理系统

### 下载包
    1.  npx create-react-app react-score-management --typescript（创建react项目）
    2.  npm install mobx mobx-react-lite -D
    3.  npm install react-router-dom  -D
    4.  npm install @types/react-router-dom
    5.  npm install axios -D
    6.  npm install antd --save
    7.  npm install node-sass sass-loader -D
    8.  npm install -D js-cookie @types/js-cookie

### 建立文件夹
    1. component文件夹 => 组件
    2. context文件夹  =>  StoreContext.ts(创建上下文)与useStore.ts(获取上下文)
    3. store文件夹  => 定义状态（数据与方法）
    4. util文件夹  => 各种工具：interface.ts(类型定义)
    5. service文件夹 => 接口api文件
    6. assets文件夹 => 静态文件
    7. 更改index.css为index.scss => 在index.tsx内把引入路径也更改一下

### 配置index.tsx初始化环境
    1. 引入数据与方法文件（store）与 引入创建的上下文（StoreContext）
    2. 使用<StoreContext.Provider>标签包裹<App />标签，并且在<StoreContext.Provider>标签上利用value传入store ，Provider:可在需要处进行数据绑定(状态共享？) 
        例：<StoreContext.Provider  value={store}>   <App />   </StoreContext.Provider>
    
**store使用mobx内的@observable时**，在tsconfig.json里面设置 experimentalDecorators:true(消除警告)		

### 路由配置
        一级路由： router.ts , 路由表: RouterViews.tsx
            登录：login.tsx
            首页：Home.tsx
            试题管理：Questions.tsx
            用户管理：User.tsx
            考试管理：Exam.tsx
            班级管理：Grade.tsx
            阅卷管理： Papers.tsx