网络请求：数据模拟 - 前后端协作_网络请求模拟-优快云博客

本文链接：https://blog.youkuaiyun.com/weixin_47700705/article/details/139283136
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body>
    <!-- 
        1、前后端分离
         前端如何与后端进行交互 （通过ajax技术 实现客户端与服务端的通信）

        2、数据结构
            1、json格式

        3、业务需求
           后端根据业务需求定义数据结构（数据字段\字典）

        4、数据模拟
            0、自行模拟数据
            1、mock.js
            2、json-server


        模拟数据的流程：
           1、明确业务需求，明确数据字典
     -->
  </body>
  <script>
    /* 用户登录的业务
      
      1、用户名
      2、密码
      3、用户身份
      4、用户id

    */

    const userArr = [
      {
        userId: "u1001",
        userName: "admin",
        userPass: "123456",
        userRole: "管理员",
      },
      {
        userId: "u1002",
        userName: "administrator",
        userPass: "123456",
        userRole: "超级管理员",
      },
      {
        userId: "u1003",
        userName: "zhangsan",
        userPass: "123456",
        userRole: "普通用户",
      },
    ];

    /* 
       汽车列表的业务
        （字段描述）    （字段名称）
         1、汽车id      carId
         2、汽车名称     carName
         3、汽车价格     carPrice
         4、汽车图片     carImg
         5、汽车描述     carDesc
         6、汽车类型     carType
         7、汽车品牌     carBrand
         8、汽车颜色     carColor
         9、汽车排量     carDisplacement
         10、汽车上市时间 carTime
         11、汽车销售状态 carStatus
         12、汽车库存    carStock
    
      录入学生信息：不少于5个
        1、学生id
        2、学生姓名
        3、学生年龄
        4、学生性别
        5、学生班级
        6、学生电话
        7、学生地址
        8、学生爱好
        9、学生头像
        10、学生描述
        11、学生状态
        12、学生成绩
        13、学生出生日期
        14、学生入学时间
        15、学生毕业时间
        16、学生家长姓名
        17、学生家长电话
        18、学生家庭住址
        19、学生家庭成员
        20、学生家庭成员电话
        21、学生家庭成员地址
        22、学生家庭成员工作
        23、学生家庭成员工作地址
        24、学生家庭成员工作电话
        25、学生家庭成员工作描述
        26、学生家庭成员工作状态
        27、学生家庭成员工作薪资
        28、学生家庭成员工作入职时间
        29、学生家庭成员工作离职时间
        30、学生家庭成员工作职位
        31、学生家庭成员工作职位描述
        32、学生家庭成员工作职位状态
        33、学生家庭成员工作职位薪资
        34、学生家庭成员工作职位入职时间
        35、学生家庭成员工作职位离职时间
        36、学生家庭成员工作职位公司
        37、学生家庭成员工作职位公司地址
      
    
    */
  </script>
</html>