当前位置： 首页 > article >正文

《JavaEE进阶》----20.＜基于Spring图书管理系统（登录+添加图书）＞

article 2024/11/8 20:47:27

PS：关于接口定义

接口定义，通常由服务器提供方来定义。

1.路径：自己定义

2.参数：根据需求考虑，我们这个接口功能完成需要哪些信息。

3.返回结果：考虑我们能为对方提供什么。站在对方角度考虑。

我们使用到的技术：

前端：”是自己在网上找的代码

后端

  • IDEA
  • Maven
  • MySQL+Mybatis
  • SSM 

做这个管理系统，首先我们需要考虑到什么呢？

第一步建立数据库

比如登录、用户要输入 用户名 和 密码。

因此对于数据库。我们需要一张用户表。用来存储用户名和密码。

还需要配置数据库 & 日志文件

搞完数据库相关的。就要写代码了。

第二步创建实体类

我们需要根据数据库字段创建一些实体类。


 

一、建立数据库

1.1配置数据库 & 日志

server:  #端口号配置
  port: 1208
spring:
  datasource: # 数据库连接配置
    url: jdbc:mysql://127.0.0.1:3306/book_test?characterEncoding=utf8&useSSL=false
    username: root
    password: 12345678
    driver-class-name: com.mysql.cj.jdbc.Driver

mybatis:
  configuration:
    log-impl: org.apache.ibatis.logging.stdout.StdOutImpl # 配置打印 MyBatis⽇志
    map-underscore-to-camel-case: true #配置驼峰⾃动转换
  mapper-locations: classpath:mapper/**Mapper.xml # 配置mybatis xml的⽂件路径，在resources/mapper创建所有表的xml⽂件
  # classpath对应resources这个目录，接下来说明在mapper这个文件夹下面，以Mapper.xml结束的都可以被加载

# 设置⽇志⽂件的⽂件名
logging:
  file:
    name: spring-book.log

 我们新建一个book_test数据库。

DROP DATABASE IF EXISTS book_test;
CREATE DATABASE book_test DEFAULT CHARACTER SET utf8mb4;

①新建一个用户表：

DROP TABLE IF EXISTS user_info;
CREATE TABLE user_info (
    `id` INT NOT NULL AUTO_INCREMENT,
    `user_name` VARCHAR ( 128 ) NOT NULL,
    `password` VARCHAR ( 128 ) NOT NULL,
    `delete_flag` TINYINT ( 4 ) NULL DEFAULT 0,
    `create_time` DATETIME DEFAULT now(),
    `update_time` DATETIME DEFAULT now() ON UPDATE now(),
    PRIMARY KEY ( `id` ), --将 id 列设置为主键，保证每条记录唯一
    UNIQUE INDEX `user_name_UNIQUE` ( `user_name` ASC )
--指定了索引的列以及排序方式。在此例中，user_name 列按照升序（ASC）排序。
--默认是升序，因此这里 ASC 是可选的。
) 
    ENGINE = INNODB --设置存储引擎为 InnoDB，支持事务和外键
    DEFAULT CHARACTER SET = utf8mb4 COMMENT = '⽤⼾表';

②新建图书表

DROP TABLE IF EXISTS book_info;
CREATE TABLE `book_info` (
    `id` INT ( 11 ) NOT NULL AUTO_INCREMENT,
    `book_name` VARCHAR ( 127 ) NOT NULL,
    `author` VARCHAR ( 127 ) NOT NULL,
    `count` INT ( 11 ) NOT NULL,
    `price` DECIMAL (7,2 ) NOT NULL,
    `publish` VARCHAR ( 256 ) NOT NULL,
    `status` TINYINT ( 4 ) DEFAULT 1 COMMENT '0-⽆效, 1-正常, 2-不允许借阅',
    `create_time` DATETIME DEFAULT now(),
    `update_time` DATETIME DEFAULT now() ON UPDATE now(),
    PRIMARY KEY ( `id` )
) ENGINE = INNODB DEFAULT CHARSET = utf8mb4;

初始化数据

-- 初始化数据 
INSERT INTO user_info ( user_name, PASSWORD ) VALUES ( "admin", "admin" );
INSERT INTO user_info ( user_name, PASSWORD ) VALUES ( "zhangsan", "123456" );
-- 初始化图书数据 
INSERT INTO `book_info` (book_name,author,count, price, publish) VALUES
 ('活着', '余华', 29, 22.00, '北京⽂艺出版社');
INSERT INTO `book_info` (book_name,author,count, price, publish) VALUES
 ('平凡的世界', '路遥', 5, 98.56, '北京⼗⽉⽂艺出版社');
INSERT INTO `book_info` (book_name,author,count, price, publish) VALUES
 ('三体', '刘慈欣', 9, 102.67, '重庆出版社');
INSERT INTO `book_info` (book_name,author,count, price, publish) VALUES
 ('⾦字塔原理', '⻨肯锡', 16, 178.00, '⺠主与建设出版社');

下面是我们建好后的用户表

图书表

二、创建实体类

2.1 用户实体类UserInfo实体类

package com.qiyangyang.springbook.demos.model;

import lombok.Data;
import java.util.Date;
@Data
public class UserInfo {
    private Integer id;
    private String userName;
    private String password;
    private Integer delete_flag;
    private Date createTime;
    private Date updateTime;
}

2.2 图书实体类 BookInfo实体类

package com.qiyangyang.springbook.demos.model;
import lombok.Data;
import java.math.BigDecimal;
import java.util.Date;
@Data
public class BookInfo {
    private Integer id;
    private String bookName;
    private String author;
    private Integer count;
    private BigDecimal price;
    private String publish;
    private Integer status;//1-可借阅   2-不可借阅  0-已删除
    private String stateCN;//根据book状态设置描述
    private Date createTime;
    private Date updateTime;
}

 三、实现用户登录接口

 3.1约定前后端交互接口

[请求]
/user/login
Content-Type: application/x-www-form-urlencoded; charset=UTF-8

[参数]
name=zhangsan&password=123456

[响应]
true //账号密码验证正确, 否则返回false

浏览器给服务器发送 /user/login 这样的 HTTP 请求, 服务器给浏览器返回了一个Boolean类型 的数据.返回true,表示账号密码验证正确 

3.2实现（后端）服务器代码

3.2.1控制层

从数据库查询用户名和密码，如果可以查到并且密码一致，就认为登录成功。

创建UserController

package com.qiyangyang.springbook.demos.controller;

import com.qiyangyang.springbook.demos.model.UserInfo;
import com.qiyangyang.springbook.demos.service.UserService;
import lombok.extern.slf4j.Slf4j;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.util.StringUtils;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RestController;
import javax.servlet.http.HttpSession;

@Slf4j
@RequestMapping("/user")
@RestController
public class UserController {
    @Autowired
    private UserService userService;
    @RequestMapping("/login")
    public boolean login(String userName, String password, HttpSession session){
        /**
         * 校验参数
         */
        if(!StringUtils.hasLength(userName) || !StringUtils.hasLength(password)){
            return false;
        }
        //判断用户输入的密码和用户输入的密码是否一致
        //我们需要查询数据库，得到数据库的密码
        UserInfo userInfo = userService.queryByName(userName);
        if(userInfo == null){
            //用户不存在
            return false;
        }
        if(password.equals(userInfo.getPassword())){
            //将密码置为空，不置为空也可以，因为Session是在服务器上的数据，客户端也看不到
            //session也是占内存的因此，不需要的不存。
            /**
             * 如果密码正确
             * 存Session
             */
            //由于密码信息是没用的，用不到。我们设置成空。不设置成空也行，因为存在服务器。客户端是看不到的
            userInfo.setPassword("");
            session.setAttribute("user_session",userInfo);
            return true;
        }
        return false;
    }
}
/**
package com.qiyangyang.springbook.demos.controller;

import com.qiyangyang.springbook.demos.model.UserInfo;
import com.qiyangyang.springbook.demos.service.UserService;
import lombok.extern.slf4j.Slf4j;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.util.StringUtils;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RestController;
import javax.servlet.http.HttpSession;

@Slf4j
@RequestMapping("/user")
@RestController
public class UserController {
    @Autowired
    private UserService userService;
    @RequestMapping("/login")
    public boolean login(String userName, String password, HttpSession session){
        /**
         * 校验参数
         */
        if(!StringUtils.hasLength(userName) || !StringUtils.hasLength(password)){
            return false;
        }
        //判断用户输入的密码和用户输入的密码是否一致
        //我们需要查询数据库，得到数据库的密码
        UserInfo userInfo = userService.queryByName(userName);
        if(userInfo == null){
            //用户不存在
            return false;
        }
        if(password.equals(userInfo.getPassword())){
            //将密码置为空，不置为空也可以，因为Session是在服务器上的数据，客户端也看不到
            //session也是占内存的因此，不需要的不存。
            /**
             * 如果密码正确
             * 存Session
             */
            //由于密码信息是没用的，用不到。我们设置成空。不设置成空也行，因为存在服务器。客户端是看不到的
            userInfo.setPassword("");
            session.setAttribute("user_session",userInfo);
            return true;
        }
        return false;
    }
}
/**
 * HttpSession session
 * 存的是根据SessionId获取的Session对象，每一个sessionId对应一个session对象。
 * 会根据客户端等等判断是新用户还是老用户。服务器里面存了很多session。
 * SessionId在后端通过服务器生成并通过 Cookie 发送给客户端。
 *
 */
 *
 */

问题1：每次我们存的Session都一样。后面用户。存的Session会覆盖前面用户的Session吗？

答：同一个用户会覆盖，不同用户，不同客户端不会覆盖。

Session表示的是会话，对话。是有来有回的，而且是多个回合。

 * HttpSession session
 * 存的是根据SessionId获取的Session对象，每一个sessionId对应一个session对象。
 * 会根据客户端等等判断是新用户还是老用户。服务器里面存了很多session。
 * SessionId在后端通过服务器生成并通过 Cookie 发送给客户端。


问题2：如果多个客户端同时访问，需不需要加多线程？

答：不需要，因为我们没有使用多线程。

请求的隔离框架已经帮我们做了。因此不考虑多线程。

什么时候才去做多线程呢，比如程序里面用到了线程池。才考虑多线程。每个用户进来login函数。信息存放在栈里面，栈是线程私有的。堆是线程公有的。这些成员变量存储在栈里面，因此每个用户的信息之间没有关系。分别对应不同的对象。

在我们需要进行优化的时候考虑多线程。比如要查询两次数据。第一次得到了密码，可以因为业务需要还要查询一次。这时候串行查询觉得太慢了。这时候考虑多线程。就可以进行并行查询。加了多线程我们就要考虑线程安全的情况。代码里用到多线程，才考虑多线程。

校验密码我们推荐在业务逻辑层来写，由于这里比较简单。我们就写在Controller中

3.2.2 业务层

创建UserService

package com.qiyangyang.springbook.demos.service;

import com.qiyangyang.springbook.demos.mapper.UserInfoMapper;
import com.qiyangyang.springbook.demos.model.UserInfo;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;

@Service
public class UserService {
    @Autowired
    private UserInfoMapper userInfoMapper;

    /**
     * 从数据库中查询用户信息
     * @param userName
     * @return
     */
    public UserInfo queryByName(String userName){
        return userInfoMapper.queryByName(userName);
    }
}

3.2.3数据层

创建UserInfoMapper

package com.qiyangyang.springbook.demos.mapper;

import com.qiyangyang.springbook.demos.model.UserInfo;
import org.apache.ibatis.annotations.Mapper;
import org.apache.ibatis.annotations.Select;

@Mapper
public interface UserInfoMapper {
    @Select("select * from user_info where delete_flag = 0 and user_name=#{userName}")
    UserInfo queryByName(String userName);


}

 3.3后端校验

使用Postman校验。多次实验发现，校验成功。然后我们再去写前端的代码。

3.4实现前端代码

3.4.1 ajax 部分

    <script src="js/jquery.min.js"></script>
    <script>
        function login() {
            $.ajax({
               type:"post",
                url:"/user/login",
                data:{
                   userName:$("#userName").val(),
                    password:$("#password").val()
                },
                success:function (result) {
                    if(result===true){
                        //验证成功
                        location.href = "book_list.html";
                    }else {
                        alert("登录失败，用户名不存在或密码错误！");
                    }
                }
            });
        }
    </script>

3.4.2完整前端登录代码 

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="css/bootstrap.min.css">
    <link rel="stylesheet" href="css/login.css">
    <script type="text/javascript" src="js/jquery.min.js"></script>
</head>

<body>
    <div class="container-login">
        <div class="container-pic">
            <img src="pic/computer.png" width="350px">
        </div>
        <div class="login-dialog">
            <h3>登陆</h3>
            <div class="row">
                <span>用户名</span>
                <input type="text" name="userName" id="userName" class="form-control">
            </div>
            <div class="row">
                <span>密码</span>
                <input type="password" name="password" id="password" class="form-control">
            </div>
            <div class="row">
                <button type="button" class="btn btn-info btn-lg" onclick="login()">登录</button>
            </div>
        </div>
    </div>
    <script src="js/jquery.min.js"></script>
    <script>
        function login() {
            $.ajax({
               type:"post",
                url:"/user/login",
                data:{
                   userName:$("#userName").val(),
                    password:$("#password").val()
                },
                success:function (result) {
                    if(result===true){
                        //验证成功
                        location.href = "book_list.html";
                    }else {
                        alert("登录失败，用户名不存在或密码错误！");
                    }
                }
            });
        }
    </script>
</body>

</html>

3.5完整校验前后端交互 

输入正确用户名和密码

成功登录，并且跳转到图书目录页面。 

输入错误用户名和密码。登录失败。弹框显示用户名不存在或密码错误。 

四、实现添加图书接口

4.1约定前后端交互

[请求]

/book/addBook

Content-Type: application/x-www-form-urlencoded; charset=UTF-8

[参数]

bookName=图书1&author=作者1&count=23&price=36&publish=出版社1&status=1

[响应]

"成功添加图书"  //失败信息, 成功时返回空字符串

我们约定浏览器给服务器发送/book/addBook 这样的HTTP请求。

form表单的形式来提交数据。服务器返回处理结果。返回“”表示图书添加成功。否则，返回失败信息。

4.2实现（后端）服务器代码

4.2.1控制层

创建BookController类

@Slf4j
@RestController
@RequestMapping("book")
public class BookController {

    @Autowired
    private BookService bookService;
    @RequestMapping("/addBook")
    public String addBook(BookInfo bookInfo){
        log.info("添加图书，bookInfo:{}",bookInfo);
        /**
         * 参数校验
         */
        if(!StringUtils.hasLength(bookInfo.getBookName())
                || !StringUtils.hasLength(bookInfo.getAuthor())
                || !StringUtils.hasLength(bookInfo.getPublish())
                || bookInfo.getCount() <=0
                || bookInfo.getPrice()==null){
            return "参数错误";
        }
        /**
         * 添加图书
         */
        /**
         * 出现错误比如参数错误。添加过程出现异常，因为MySQL会出现一些异常
         * 我们使用try/catch来捕获。
         */
        try {
            bookService.insertBook(bookInfo);
        }catch (Exception a){
            return "内部发生错误，请联系管理员";
        }
        /**
         * 返回成功添加吐过表示图书插入成功。
         */
        return "成功添加图书";
    }
}

4.2.2 业务层

创建BookService类

@Service
public class BookService {
    @Autowired
    private BookInfoMapper bookInfoMapper;

    public Integer insertBook(BookInfo bookInfo){
        return bookInfoMapper.insertBook(bookInfo);
    }
}

4.2.3 数据层

创建BookInfoMapper

@Mapper
public interface BookInfoMapper {
    @Insert("insert into book_info(book_name,author,count,price,publish) " +
            "values (#{bookName},#{author},#{count},#{price},#{publish})")
    Integer insertBook(BookInfo bookInfo);
}

4.3后端测试

填写正确数据，返回成功添加图书

填写错误数据，返回参数错误 

 

小bug （后端服务器问题）

count 和 price为字符串时，会报400错误。请求参数类型不匹配。

日志显示在绑定 bookInfo 对象时出现了类型转换错误：

  • count 字段：后端定义 count 应为 Integer，但接收到的值是 "五大"（字符串）。
  • price 字段：后端定义 price 应为 BigDecimal，但接收到的值是 "带娃"（字符串）。

因为这些值无法转换成期望的数值类型，所以 Spring 在尝试绑定请求参数时抛出了 BindException，并返回 HTTP 400 错误，表示请求的格式或内容无效。

 

4..4实现前端代码 

4.4.1 form表单 和 ajax 部分

form表单

我们可以把提交的数据写成一个form表单。

form表单 Id 在前端显示页面并没有什么作用。主要是搭配后端来进行前后端交互。 

整个表单内容需要提交的话，我们可以借助form标签来提交整个表单

         

data: $("#addBook").serialize(), //序列化

 //这个函数会把整个表单的所有的input框..等等输入的项目都会提交

提交的结构是以key : value 键值对的形式提交

key就是name

value就是输入的值。

      <form id="addBook">
        <div class="form-group">
          <label for="bookName">图书名称:</label>
          <input
            type="text"
            class="form-control"
            placeholder="请输入图书名称"
            id="bookName"
            name="bookName"
          />
        </div>


        <form id="addBook">  
            <div class="form-group">
                <label for="bookName">图书名称:</label>
                <input type="text" class="form-control" placeholder="请输入图书名称" id="bookName" name="bookName">
            </div>
            <div class="form-group">
                <label for="bookAuthor">图书作者</label>
                <input type="text" class="form-control" placeholder="请输入图书作者" id="bookAuthor" name="author" />
            </div>
            <div class="form-group">
                <label for="bookStock">图书库存</label>
                <input type="text" class="form-control" placeholder="请输入图书库存" id="bookStock" name="count"/>
            </div>

            <div class="form-group">
                <label for="bookPrice">图书定价：</label>
                <input type="number" class="form-control" placeholder="请输入价格" id="bookPrice" name="price">
            </div>

            <div class="form-group">
                <label for="bookPublisher">出版社</label>
                <input type="text" id="bookPublisher" class="form-control" placeholder="请输入图书出版社" name="publish" />
            </div>
            <div class="form-group">
                <label for="bookStatus">图书状态</label>
                <select class="custom-select" id="bookStatus" name="status">
                    <option value="1" selected>可借阅</option>
                    <option value="2">不可借阅</option>
                </select>
            </div>

            <div class="form-group" style="text-align: right">
                <button type="button" class="btn btn-info btn-lg" onclick="add()">确定</button>
                <button type="button" class="btn btn-secondary btn-lg" onclick="javascript:history.back()">返回</button>
            </div>
        </form>

ajax部分 

    <script type="text/javascript" src="js/jquery.min.js"></script>
    <script>
        function add() {
            $.ajax({
                type:"post",
                url:"/book/addBook",
//整个表单内容需要提交的话，我们可以借助form标签来提交整个表单，搭配后端做一些交互来使用的。
                data: $("#addBook").serialize(),//序列化
//这个函数会把整个表单的所有的input框..等等输入的项目都会提交
                success:function (result) {
                    if(result === "成功添加图书"){
                        alert("添加成功");
                        location.href = "book_list.html";
                    }else {
                        alert(result);
                    }
                }
            });

        }
    </script>

4.4.2完整前端添加图书代码

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>添加图书</title>
    <link rel="stylesheet" href="css/bootstrap.min.css" />
    <link rel="stylesheet" href="css/add.css" />
  </head>

  <body>
    <div class="container">
      <div class="form-inline">
        <h2 style="text-align: left; margin-left: 10px">
          <svg
            xmlns="http://www.w3.org/2000/svg"
            width="40"
            fill="#17a2b8"
            class="bi bi-book-half"
            viewBox="0 0 16 16"
          >
            <path
              d="M8.5 2.687c.654-.689 1.782-.886 3.112-.752 1.234.124 2.503.523 3.388.893v9.923c-.918-.35-2.107-.692-3.287-.81-1.094-.111-2.278-.039-3.213.492V2.687zM8 1.783C7.015.936 5.587.81 4.287.94c-1.514.153-3.042.672-3.994 1.105A.5.5 0 0 0 0 2.5v11a.5.5 0 0 0 .707.455c.882-.4 2.303-.881 3.68-1.02 1.409-.142 2.59.087 3.223.877a.5.5 0 0 0 .78 0c.633-.79 1.814-1.019 3.222-.877 1.378.139 2.8.62 3.681 1.02A.5.5 0 0 0 16 13.5v-11a.5.5 0 0 0-.293-.455c-.952-.433-2.48-.952-3.994-1.105C10.413.809 8.985.936 8 1.783z"
            />
          </svg>
          <span>添加图书</span>
        </h2>
      </div>

      <form id="addBook">
        <div class="form-group">
          <label for="bookName">图书名称:</label>
          <input
            type="text"
            class="form-control"
            placeholder="请输入图书名称"
            id="bookName"
            name="bookName"
          />
        </div>
        <div class="form-group">
          <label for="bookAuthor">图书作者</label>
          <input
            type="text"
            class="form-control"
            placeholder="请输入图书作者"
            id="bookAuthor"
            name="author"
          />
        </div>
        <div class="form-group">
          <label for="bookStock">图书库存</label>
          <input
            type="text"
            class="form-control"
            placeholder="请输入图书库存"
            id="bookStock"
            name="count"
          />
        </div>

        <div class="form-group">
          <label for="bookPrice">图书定价：</label>
          <input
            type="number"
            class="form-control"
            placeholder="请输入价格"
            id="bookPrice"
            name="price"
          />
        </div>

        <div class="form-group">
          <label for="bookPublisher">出版社</label>
          <input
            type="text"
            id="bookPublisher"
            class="form-control"
            placeholder="请输入图书出版社"
            name="publish"
          />
        </div>
        <div class="form-group">
          <label for="bookStatus">图书状态</label>
          <select class="custom-select" id="bookStatus" name="status">
            <option value="1" selected>可借阅</option>
            <option value="2">不可借阅</option>
          </select>
        </div>

        <div class="form-group" style="text-align: right">
          <button type="button" class="btn btn-info btn-lg" onclick="add()">
            确定
          </button>
          <button
            type="button"
            class="btn btn-secondary btn-lg"
            onclick="javascript:history.back()"
          >
            返回
          </button>
        </div>
      </form>
    </div>
    <script type="text/javascript" src="js/jquery.min.js"></script>
    <script>
      function add() {
        $.ajax({
          type: "post",
          url: "/book/addBook",
          //整个表单内容需要提交的话，我们可以借助form标签来提交整个表单，搭配后端做一些交互来使用的。
          data: $("#addBook").serialize(), //序列化
          //这个函数会把整个表单的所有的input框..等等输入的项目都会提交
          success: function (result) {
            if (result === "成功添加图书") {
              alert("添加成功");
              location.href = "book_list.html";
            } else {
              alert(result);
            }
          },
        });
      }
    </script>
  </body>
</html>

4.5完整校验前后端交互

输入正确数据

成功添加到我们的数据库中。 

输入错误数据。

弹框提示输入参数错误！ 

本篇内容已经很多。

后续内容在下一篇文章中！


http://www.kler.cn/a/384874.html

相关文章：

  • 设计模式（主要的五种）
  • 2024MoonBit全球编程创新挑战赛参赛作品“飞翔的小鸟”技术开发指南
  • Unet++改进3：添加NAMAttention注意力机制
  • EPPlus 开源项目的编译和使用
  • STM32实现串口接收不定长数据
  • .NET6中WPF项目添加System.Windows.Forms引用
  • sass @mixin @extend
  • 善用Git LFS来降低模型文件对磁盘的占用
  • 可视化建模与UML《顺序图实验报告》
  • 前后端交互通用排序策略
  • 基于TRIZ的教育机器人功能创新
  • 若依未分离版集成达梦数据库
  • C++异常：基本语法
  • 深入浅出 Spring Boot 与 Shiro：构建安全认证与权限管理框架
  • 基于STM32的智能充电桩：集成RTOS、MQTT与SQLite的先进管理系统设计思路
  • [linux]docker基础
  • uniapp 下拉选择器picker
  • 从配置anaconda到配置pycharm
  • C#笔记 —— 事件
  • 第3章 CentOS系统管理
  • ssm063基于SSM框架的德云社票务系统的设计与实现+vue(论文+源码)_kaic
  • vue3 element-plus el-scrollbar 自动滚动
  • Webserver(5.5)解析HTTP请求报文
  • 在PHP中使用UTF-8编码防止乱码需要注意以下几点‌：
  • vue种ref跟reactive的区别?
  • VisionPro —— CogIPOneImgeTool工具详解