中享思途实训-EW帮帮网

创建小程序

文件夹右键，新建page，就会创建好4个文件（wxml，wxss，js，json）

小程序的app.json，pages中第一项是默认启动页面，或写entrypagePath确定

新建导航栏

在app.json中，写tabBar

导航栏的list只是一个属性，还有其他配置，如color，selectedcolor，

idea中servlet继承父类，ctrl+o，

shift+点击两次（选择起始和结束）

ctrl+点击，

连接数据库

DAO database access object 数据库访问对象

项目结构

一、整体包结构说明

你这是一个基于 Servlet 的 Java Web 项目，按功能 / 职责把代码分到不同包（dao、model、servlet、util ）里，方便管理和维护，就像把 “做饭工具放厨房、碗碟放餐厅、食材放仓库” 一样，各司其职～

二、逐个包 / 文件拆解

1. `com.situ.huawei`（根包，项目基础标识）

所有类都放在这个根包下，区分和其他项目的代码，类似你给 “家里所有东西” 统一贴个 “自家专属” 标签，别人一看包名就知道是你这个项目的代码。

2. `model` 包 → 放 “数据模型”

Category.java：
是一个 实体类（也叫领域模型、POJO ），用来 “装数据”。比如你要操作 “分类信息”（像手机、穿戴这些分类），就定义这个类，里面有 id、name 等属性，对应数据库里的分类表字段。
举个栗子：从数据库查分类数据时，把查到的一行数据，用 Category 对象的属性存起来（category.setId(1); category.setName("手机") ），方便在代码里传递、处理。

3. `dao` 包 → 放 “数据访问逻辑”（和数据库打交道）

CategoryDao.java：
是一个接口，定义 “怎么操作数据库里的分类表”。比如定义 List<Category> findAll();（查所有分类）、Category findById(int id);（按 ID 查分类）这些方法的 “声明”，只说要干啥，不说具体咋干。
作用：规范对分类数据的操作，以后换数据库（比如从 MySQL 换 Oracle ），只要接口不变，改实现类就行，不影响其他代码。
impl 子包 + CategoryDaoImpl.java：
impl 是 dao 的实现子包，CategoryDaoImpl 是 CategoryDao 接口的 实现类。里面写具体咋操作数据库：比如 findAll() 方法里，写 JDBC 代码（或用框架）连接数据库，执行 SELECT * FROM category SQL，把结果转成 Category 列表返回。
作用：把 “操作数据库的具体逻辑” 封装在这里，Servlet 等上层代码只需要调用 CategoryDao 接口的方法，不用关心数据库咋连、SQL 咋写，降低耦合。

4. `servlet` 包 → 放 “Web 接口逻辑”（处理 HTTP 请求）

CategoryServlet.java：
继承 HttpServlet，是 核心的 Web 接口类。用来处理和 “分类” 相关的 HTTP 请求（比如 GET 查分类列表、POST 新增分类）。
流程大概是：收到请求 → 调用 dao 层代码查 / 改数据库 → 用 util 里的工具封装响应 → 返回给前端 JSON 数据。
比如前端访问 /api/v1/categories ，这个 Servlet 就会处理，查分类列表，再通过 ServletUtils 把结果返回。
HelloServlet.java：
也是一个 Servlet 类，可能是用来做 “测试” 或 “简单功能” 的。比如处理 /hello 这类请求，返回 “Hello World”，验证 Servlet 能不能正常跑，或者做一些基础的接口演示。

5. `util` 包 → 放 “通用工具类”（给其他类打杂的）

HttpResult.java：
是一个 响应结果封装类，用来统一接口返回的 JSON 格式。里面有 code（状态码，比如 200 成功、500 失败）、msg（提示信息）、data（具体返回的数据，比如分类列表）。
作用：让所有接口返回的格式统一，前端好解析；也方便后端代码封装响应，不用每次都手动拼 JSON 字符串。
ServletUtils.java：
是 Servlet 辅助工具类，里面的方法用来 “简化 Servlet 写响应的流程”。比如 renderHttpRequest 方法，帮你自动设置响应头（Content-Type、编码）、把 HttpResult 转成 JSON 写到响应里，避免每个 Servlet 都重复写这些代码，减少冗余。

三、整体流程（一个请求的处理示例）

假设前端要查 “所有分类”，访问 http://localhost:8080/api/v1/categories ：

CategoryServlet 接活：收到 GET 请求，知道要查分类。
找 dao 层干活：调用 CategoryDao 接口的 findAll() 方法，具体由 CategoryDaoImpl 执行 SQL 查数据库，拿到分类数据列表（转成 Category 对象集合）。
用 util 封装响应：把分类列表用 HttpResult 封装成统一格式（比如 code=200，data=分类列表 ），再通过 ServletUtils.renderHttpRequest 方法，设置响应头、转 JSON 、写回响应。
前端收到数据：拿到统一格式的 JSON ，解析后展示分类列表。

这样分层后，代码职责清晰：

model 管数据长啥样
dao 管咋从数据库拿数据
servlet 管咋处理 HTTP 请求、协调各层
util 管通用工具，谁需要谁调用

哪怕项目变大，也容易找到对应功能的代码，维护起来更轻松～


// pages/category/category.js
Page({
  data: {
    name:"张三",
    age:20,
    linkUrl:"/pages/login/login",

    person: {
      name:"李四",
      age:21,
      linkUrl:"/pages/login/login",
      sex:false,
    },
    categoryList: [],
  activeId:1
  
  },
  onReady:function() {
    console.log(132);
    console.log("外this",this);
    const that = this;
    wx.request({
      url: 'http://localhost:8080/api/v1/categories',
      method: 'GET',
      // data:
      success: function(result){
        console.log("内this",this);
        if(result.statusCode === 200){
          const code = result.statusCode;
          const data = result.data;
          if(code === 200) {
            that.setData({
              categoryList: data,
            })
          }
        }else{
          console.log("statusCode不为200");
        }
        console.log("success");
      },
      fail: function(err){
        console.log("fail");
        console.log(err);
      },
      complete: function(){
        console.log("complete");
      }
    })
  },
  tapHandler: function(e){
    this.setData({
      activeId: e.currentTarget.dataset.id
    })
    // console.log(e,1);
    // console.log(e.currentTarget,2);
    // console.log(e.currentTarget.dataset,3);
    // console.log(e.currentTarget.dataset.id,4);
    // console.log(123);
  },
  

})

函数穿透：在外层定义that = this

或者使用箭头函数

success: (result) =>{ }