【SpringBoot + Vue 尚庭公寓实战】项目初始化准备(二)

本文主要是介绍【SpringBoot + Vue 尚庭公寓实战】项目初始化准备(二),希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

尚庭公寓SpringBoot + Vue 项目实战】项目初始化准备(二)


文章目录

      • 尚庭公寓SpringBoot + Vue 项目实战】项目初始化准备(二)
        • 1、导入数据库
        • 2、创建工程
        • 3、项目初始配置
          • 3.1、SpringBoot依赖配置
          • 3.2、创建application.yml文件
          • 3.3、创建SpringBoot启动类
        • 4、MyBatisPlus配置
          • 4.1、pom文件配置
          • 4.2、application.yml配置
          • 4.3、配置扫包
        • 5、Knife4j配置
        • 6、生成或导入基础代码
        • 7、导入接口定义代码

1、导入数据库

在MySQL中创建一个lease数据库,建库语句如下

CREATE DATABASE lease CHARACTER SET utf8mb4 COLLATE utf8mb4_general_ci;

导入数据库脚本,将资料中的lease.sql脚本导入lease数据库,其中包含了建表语句和少量的原始数据。

image-20240605222421027

image-20240605222502792

2、创建工程

按照如下目录结构创建一个多模块的Maven工程。

lease
├── common(公共模块——工具类、公用配置等)
│   ├── pom.xml
│   └── src
├── model(数据模型——与数据库相对应地实体类)
│   ├── pom.xml
│   └── src
├── web(Web模块)
│   ├── pom.xml
│   ├── web-admin(后台管理系统Web模块——包含mapper、service、controller)
│   │   ├── pom.xml
│   │   └── src
│   └── web-app(移动端Web模块——包含mapper、service、controller)
│       ├── pom.xml
│       └── src
└── pom.xml

image-20240605223032690

各模块的pom.xml文件内容如下:

  • 根模块

    <?xml version="1.0" encoding="UTF-8"?>
    <project xmlns="http://maven.apache.org/POM/4.0.0"xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd"><modelVersion>4.0.0</modelVersion><groupId>org.demo</groupId><artifactId>lease</artifactId><version>1.0-SNAPSHOT</version><packaging>pom</packaging><modules><module>common</module><module>model</module><module>web</module></modules><properties><maven.compiler.source>17</maven.compiler.source><maven.compiler.target>17</maven.compiler.target><project.build.sourceEncoding>UTF-8</project.build.sourceEncoding></properties></project>
    
  • common模块

    <?xml version="1.0" encoding="UTF-8"?>
    <project xmlns="http://maven.apache.org/POM/4.0.0"xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd"><modelVersion>4.0.0</modelVersion><parent><groupId>org.demo</groupId><artifactId>lease</artifactId><version>1.0-SNAPSHOT</version></parent><artifactId>common</artifactId><properties><maven.compiler.source>17</maven.compiler.source><maven.compiler.target>17</maven.compiler.target><project.build.sourceEncoding>UTF-8</project.build.sourceEncoding></properties></project>
    
  • web模块

    <?xml version="1.0" encoding="UTF-8"?>
    <project xmlns="http://maven.apache.org/POM/4.0.0"xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd"><modelVersion>4.0.0</modelVersion><parent><groupId>org.demo</groupId><artifactId>lease</artifactId><version>1.0-SNAPSHOT</version></parent><artifactId>web</artifactId><packaging>pom</packaging><modules><module>web-admin</module><module>web-app</module></modules><properties><maven.compiler.source>17</maven.compiler.source><maven.compiler.target>17</maven.compiler.target><project.build.sourceEncoding>UTF-8</project.build.sourceEncoding></properties><dependencies><dependency><groupId>org.demo</groupId><artifactId>model</artifactId><version>1.0-SNAPSHOT</version></dependency><dependency><groupId>org.demo</groupId><artifactId>common</artifactId><version>1.0-SNAPSHOT</version></dependency></dependencies></project>
    
  • web-admin模块

    <?xml version="1.0" encoding="UTF-8"?>
    <project xmlns="http://maven.apache.org/POM/4.0.0"xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd"><modelVersion>4.0.0</modelVersion><parent><groupId>org.demo</groupId><artifactId>web</artifactId><version>1.0-SNAPSHOT</version></parent><artifactId>web-admin</artifactId><properties><maven.compiler.source>17</maven.compiler.source><maven.compiler.target>17</maven.compiler.target><project.build.sourceEncoding>UTF-8</project.build.sourceEncoding></properties></project>
    
  • web-app模块

    <?xml version="1.0" encoding="UTF-8"?>
    <project xmlns="http://maven.apache.org/POM/4.0.0"xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd"><modelVersion>4.0.0</modelVersion><parent><groupId>org.demo</groupId><artifactId>web</artifactId><version>1.0-SNAPSHOT</version></parent><artifactId>web-app</artifactId><properties><maven.compiler.source>17</maven.compiler.source><maven.compiler.target>17</maven.compiler.target><project.build.sourceEncoding>UTF-8</project.build.sourceEncoding></properties></project>
    
3、项目初始配置
3.1、SpringBoot依赖配置

父工程的pom.xml文件中增加如下内容 , 进行版本控制

注意:这里出现标红是正常现象,因为你的本地仓库找不到,暂时不需要管理,因为等到子模块使用的时候,再进行导入依赖

image-20240605224909339

<!-- 继承Spring Boot父项目 -->
<parent><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-parent</artifactId><version>3.0.5</version>
</parent><!-- 注意:直接替换pom文件中原有的properties -->
<properties><maven.compiler.source>17</maven.compiler.source><maven.compiler.target>17</maven.compiler.target><project.build.sourceEncoding>UTF-8</project.build.sourceEncoding><mybatis-plus.version>3.5.3.1</mybatis-plus.version><swagger.version>2.9.2</swagger.version><jwt.version>0.11.2</jwt.version><easycaptcha.version>1.6.2</easycaptcha.version><minio.version>8.2.0</minio.version><knife4j.version>4.1.0</knife4j.version><aliyun.sms.version>2.0.23</aliyun.sms.version>
</properties><!--配置dependencyManagement统一管理依赖版本-->
<dependencyManagement><dependencies><!--mybatis-plus--><!--官方文档:https://baomidou.com/pages/bab2db/ --><dependency><groupId>com.baomidou</groupId><artifactId>mybatis-plus-boot-starter</artifactId><version>${mybatis-plus.version}</version></dependency><!--knife4j文档--><!--官方文档:https://doc.xiaominfo.com/docs/quick-start --><dependency><groupId>com.github.xiaoymin</groupId><artifactId>knife4j-openapi3-jakarta-spring-boot-starter</artifactId><version>${knife4j.version}</version></dependency><!--JWT登录认证相关--><!--官方文档:https://github.com/jwtk/jjwt#install-jdk-maven --><dependency><groupId>io.jsonwebtoken</groupId><artifactId>jjwt-api</artifactId><version>${jwt.version}</version></dependency><dependency><groupId>io.jsonwebtoken</groupId><artifactId>jjwt-impl</artifactId><scope>runtime</scope><version>${jwt.version}</version></dependency><dependency><groupId>io.jsonwebtoken</groupId><artifactId>jjwt-jackson</artifactId><scope>runtime</scope><version>${jwt.version}</version></dependency><!--图形验证码--><!--官方文档:https://gitee.com/ele-admin/EasyCaptcha --><dependency><groupId>com.github.whvcse</groupId><artifactId>easy-captcha</artifactId><version>${easycaptcha.version}</version></dependency><!--对象存储,用于存储图像等非结构化数据--><!--官方文档:https://min.io/docs/minio/linux/developers/minio-drivers.html?ref=docs#java-sdk --><dependency><groupId>io.minio</groupId><artifactId>minio</artifactId><version>${minio.version}</version></dependency><!--阿里云短信客户端,用于发送短信验证码--><!--官方文档:https://help.aliyun.com/document_detail/215759.html?spm=a2c4g.215759.0.0.49f32807f4Yc0y --><dependency><groupId>com.aliyun</groupId><artifactId>dysmsapi20170525</artifactId><version>${aliyun.sms.version}</version></dependency></dependencies>
</dependencyManagement>

web模块的pom.xml文件中增加如下内容

  • 依赖
<!--包含spring web相关依赖-->
<dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-web</artifactId>
</dependency><!--包含spring test相关依赖-->
<dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-test</artifactId><scope>test</scope>
</dependency>
  • 插件
<!-- Spring Boot Maven插件,用于打包可执行的JAR文件 -->
<build><plugins><plugin><groupId>org.springframework.boot</groupId><artifactId>spring-boot-maven-plugin</artifactId></plugin></plugins>
</build>
3.2、创建application.yml文件

web-admin模块src/main/resources目录下创建application.yml配置文件,内容如下:

server:port: 8080
3.3、创建SpringBoot启动类

web-admin模块下创建com.demo.lease.AdminWebApplication类,内容如下:

@SpringBootApplication
public class AdminWebApplication {public static void main(String[] args) {SpringApplication.run(AdminWebApplication.class, args);}
}
4、MyBatisPlus配置

Mybatis-Plus为公用工具,故将其配置于common模块。具体配置可参考其官方文档。

4.1、pom文件配置

common模块的pom.xml文件中增加如下内容:

<!--mybatis-plus-->
<dependency><groupId>com.baomidou</groupId><artifactId>mybatis-plus-boot-starter</artifactId>
</dependency><!--mysql驱动-->
<dependency><groupId>com.mysql</groupId><artifactId>mysql-connector-j</artifactId>
</dependency>

model模块的pom.xml文件中增加如下内容,因为model模块下的实体类中需要配置Mybatis-Plus相关注解,故也需引入Mybatis-Plus依赖

<!--mybatis-plus-->
<dependency><groupId>com.baomidou</groupId><artifactId>mybatis-plus-boot-starter</artifactId>
</dependency>
4.2、application.yml配置

web-admin模块application.yml文件增加如下内容:

spring:datasource:type: com.zaxxer.hikari.HikariDataSourceurl: jdbc:mysql://<hostname>:<port>/<database>?useUnicode=true&characterEncoding=utf-8&useSSL=false&allowPublicKeyRetrieval=true&serverTimezone=GMT%2b8username: <username>password: <password>hikari:connection-test-query: SELECT 1 # 自动检测连接connection-timeout: 60000 #数据库连接超时时间,默认30秒idle-timeout: 500000 #空闲连接存活最大时间,默认600000(10分钟)max-lifetime: 540000 #此属性控制池中连接的最长生命周期,值0表示无限生命周期,默认1800000即30分钟maximum-pool-size: 12 #连接池最大连接数,默认是10minimum-idle: 10 #最小空闲连接数量pool-name: SPHHikariPool # 连接池名称#用于打印框架生成的sql语句,便于调试
mybatis-plus:configuration:log-impl: org.apache.ibatis.logging.stdout.StdOutImpl

注意:需根据实际情况修改hostnameportdatabaseusernamepassword

4.3、配置扫包

common模块下创建com.demo.lease.common.mybatisplus.MybatisPlusConfiguration类,内容如下:

@Configuration
@MapperScan("com.atguigu.lease.web.*.mapper")
public class MybatisPlusConfiguration {}

注意@MapperScan()的包路径需要根据实际情况进行修改。

5、Knife4j配置

pom文件配置

web模块的pom.xml文件添加如下内容

因为web-app模块同样需要Knife4j依赖,故在两个的父工程引入依赖即可

<dependency><groupId>com.github.xiaoymin</groupId><artifactId>knife4j-openapi3-jakarta-spring-boot-starter</artifactId>
</dependency>

model模块的pom.xml文件添加上述内容

因为model模块下的实体类需要配置Knife4j相关注解,故也需引入Knife4j依赖

<dependency><groupId>com.github.xiaoymin</groupId><artifactId>knife4j-openapi3-jakarta-spring-boot-starter</artifactId>
</dependency>

配置类

后台管理系统和移动端的接口配置并不相同,所以需各自编写一个配置类。在web-admin模块下创建com.atguigu.lease.web.admin.custom.config.Knife4jConfiguration类,内容如下:

@Configuration
public class Knife4jConfiguration {@Beanpublic OpenAPI customOpenAPI() {return new OpenAPI().info(new Info().title("后台管理系统API").version("1.0").description("后台管理系统API"));}@Beanpublic GroupedOpenApi systemAPI() {return GroupedOpenApi.builder().group("系统信息管理").pathsToMatch("/admin/system/**").build();}@Beanpublic GroupedOpenApi loginAPI() {return GroupedOpenApi.builder().group("后台登录管理").pathsToMatch("/admin/login/**","/admin/info").build();}@Beanpublic GroupedOpenApi apartmentAPI() {return GroupedOpenApi.builder().group("公寓信息管理").pathsToMatch("/admin/apartment/**","/admin/room/**","/admin/label/**","/admin/facility/**","/admin/fee/**","/admin/attr/**","/admin/payment/**","/admin/region/**","/admin/term/**","/admin/file/**").build();}@Beanpublic GroupedOpenApi leaseAPI() {return GroupedOpenApi.builder().group("租赁信息管理").pathsToMatch("/admin/appointment/**","/admin/agreement/**").build();}@Beanpublic GroupedOpenApi userAPI() {return GroupedOpenApi.builder().group("平台用户管理").pathsToMatch("/admin/user/**").build();}
}

注意pathsToMatch参数需要根据实际情况进行配置。

6、生成或导入基础代码

在完成上述配置后,便可使用一些逆向工具自动生成基础代码了(例如实体类、mapper、service等),在使用Mybatis-Plus作为存储层框架时,推荐使用IDEA中的Mybatis X插件。除了可自动生成这些代码,也可直接导入资料中提供的代码。推荐大家直接导入。

导入的代码和目标位置如下:

导入代码模块包名/路径说明
实体类modelcom.atguigu.lease.model.entity与数据库表一一对应
枚举类modelcom.atguigu.lease.model.enums实体类中的某些状态类字段,使用枚举类型
mapper接口web-admincom.atguigu.lease.web.admin.mapper
mapper xmlweb-adminsrc/main/resources/mapper
serviceweb-admincom.atguigu.lease.web.admin.service
serviceImplweb-admincom.atguigu.lease.web.admin.service.impl

知识点

  • 实体类中的公共字段(例如idcreate_timeupdate_timeis_deleted)抽取到一个基类,进行统一管理,然后让各实体类继承该基类。

  • 实体类中的状态字段(例如status)或类型字段(例如type),全部使用枚举类型。

    状态(类型)字段,在数据库中通常用一个数字表示一个状态(类型)。例如:订单状态(1:待支付,2:待发货,3:待收货,4:已收货,5:已完结)。若实体类中对应的字段也用数字类型,例如int,那么程序中就会有大量的如下代码:

    order.setStatus(1);if (order.getStatus() == 1) {
    order.setStatus(2);
    }
    

    这些代码后期维护起来会十分麻烦,所以本项目中所有的此类字段均使用枚举类型。例如上述订单状态可定义为以下枚举:

    public enum Status {CANCEL(0, "已取消"),
    WAIT_PAY(1, "待支付"),
    WAIT_TRANSFER(2, "待发货"),
    WAIT_RECEIPT(3, "待收货"),
    RECEIVE(4, "已收货"),
    COMPLETE(5, "已完结");private final Integer value;
    private final String desc;public Integer value() {return value;
    }
    public String desc() {return desc;
    }
    }
    

    订单实体类中的状态字段定义为Status类型:

    @Data
    public class Order{private Integer id;private Integer userId;private Status status;...
    }
    

    这样上述代码便可调整为如下效果,后期维护起来会容易许多。

    order.setStatus(Status.WAIT_PAY);
    
  • 所有的实体类均实现了Serializable接口,方便对实体对象进行缓存。

  • 所有的Mapper接口均没有使用@Mapper注解,而是使用@MapperScan注解统一扫描。

7、导入接口定义代码

资料中提供了所有的Controller代码,并且Controller中定义好了每个接口(只有定义,没有实现),大家可直接导入接口定义相关的代码,然后只专注于接口逻辑的实现。

导入的代码和目标位置如下:

导入代码模块包名/路径说明
controllerweb-admincom.atguigu.lease.web.admin.controller
voweb-admincom.atguigu.lease.web.admin.voView Object,用于封装或定义接口接受及返回的数据结构
resultcommoncom.atguigu.lease.common.result统一定义接口返回的数据结构

导入完成后,便可启动SpringBoot项目,并访问接口文档了,Knife4j文档的url为:http://localhost:8080/doc.html。

知识点

  • vo(View Object):用于封装或定义接口接收及返回的数据的结构。

  • 统一接口返回数据结构:为方便前端对接口数据进行处理,统一接口返回数据结构是一个良好的习惯。

    以下是所有接口统一返回的数据结构

    {"code": 200,"message": "正常","data": {"id": "1","name": "zhangsan","age": 10}
    }
    

    以下是与上述结构相对应的Java类

    • Result

      @Data
      public class Result<T> {//返回码private Integer code;//返回消息private String message;//返回数据private T data;public Result() {}private static <T> Result<T> build(T data) {Result<T> result = new Result<>();if (data != null)result.setData(data);return result;}public static <T> Result<T> build(T body, ResultCodeEnum resultCodeEnum) {Result<T> result = build(body);result.setCode(resultCodeEnum.getCode());result.setMessage(resultCodeEnum.getMessage());return result;}public static <T> Result<T> ok(T data) {return build(data, ResultCodeEnum.SUCCESS);}public static <T> Result<T> ok() {return Result.ok(null);}public static <T> Result<T> fail() {return build(null, ResultCodeEnum.FAIL);}public static <T> Result<T> fail(Integer code, String message) {Result<T> result = build(null);result.setCode(code);result.setMessage(message);return result;}
      }
      
    • ResultCodeEnum

      为方便管理,可将返回码code和返回消息message封装到枚举类。

      @Getter
      public enum ResultCodeEnum {SUCCESS(200, "成功"),FAIL(201, "失败"),PARAM_ERROR(202, "参数不正确"),SERVICE_ERROR(203, "服务异常"),DATA_ERROR(204, "数据异常"),ILLEGAL_REQUEST(205, "非法请求"),REPEAT_SUBMIT(206, "重复提交"),DELETE_ERROR(207, "请先删除子集"),ADMIN_ACCOUNT_EXIST_ERROR(301, "账号已存在"),ADMIN_CAPTCHA_CODE_ERROR(302, "验证码错误"),ADMIN_CAPTCHA_CODE_EXPIRED(303, "验证码已过期"),ADMIN_CAPTCHA_CODE_NOT_FOUND(304, "未输入验证码"),ADMIN_LOGIN_AUTH(305, "未登陆"),ADMIN_ACCOUNT_NOT_EXIST_ERROR(306, "账号不存在"),ADMIN_ACCOUNT_ERROR(307, "用户名或密码错误"),ADMIN_ACCOUNT_DISABLED_ERROR(308, "该用户已被禁用"),ADMIN_ACCESS_FORBIDDEN(309, "无访问权限"),APP_LOGIN_AUTH(501, "未登陆"),APP_LOGIN_PHONE_EMPTY(502, "手机号码为空"),APP_LOGIN_CODE_EMPTY(503, "验证码为空"),APP_SEND_SMS_TOO_OFTEN(504, "验证法发送过于频繁"),APP_LOGIN_CODE_EXPIRED(505, "验证码已过期"),APP_LOGIN_CODE_ERROR(506, "验证码错误"),APP_ACCOUNT_DISABLED_ERROR(507, "该用户已被禁用"),TOKEN_EXPIRED(601, "token过期"),TOKEN_INVALID(602, "token非法");private final Integer code;private final String message;ResultCodeEnum(Integer code, String message) {this.code = code;this.message = message;}
      }
      

    注意:

    由于ResultResultCodeEnum中使用@Data@Getter注解,因此需要再common模块中引入lombok依赖。

    <dependency><groupId>org.projectlombok</groupId><artifactId>lombok</artifactId>
    </dependency>
    

这篇关于【SpringBoot + Vue 尚庭公寓实战】项目初始化准备(二)的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/1037273

相关文章

网页解析 lxml 库--实战

lxml库使用流程 lxml 是 Python 的第三方解析库,完全使用 Python 语言编写,它对 XPath表达式提供了良好的支 持,因此能够了高效地解析 HTML/XML 文档。本节讲解如何通过 lxml 库解析 HTML 文档。 pip install lxml lxm| 库提供了一个 etree 模块,该模块专门用来解析 HTML/XML 文档,下面来介绍一下 lxml 库

Vue3 的 shallowRef 和 shallowReactive:优化性能

大家对 Vue3 的 ref 和 reactive 都很熟悉,那么对 shallowRef 和 shallowReactive 是否了解呢? 在编程和数据结构中,“shallow”(浅层)通常指对数据结构的最外层进行操作,而不递归地处理其内部或嵌套的数据。这种处理方式关注的是数据结构的第一层属性或元素,而忽略更深层次的嵌套内容。 1. 浅层与深层的对比 1.1 浅层(Shallow) 定义

JVM 的类初始化机制

前言 当你在 Java 程序中new对象时,有没有考虑过 JVM 是如何把静态的字节码(byte code)转化为运行时对象的呢,这个问题看似简单,但清楚的同学相信也不会太多,这篇文章首先介绍 JVM 类初始化的机制,然后给出几个易出错的实例来分析,帮助大家更好理解这个知识点。 JVM 将字节码转化为运行时对象分为三个阶段,分别是:loading 、Linking、initialization

Spring Security 基于表达式的权限控制

前言 spring security 3.0已经可以使用spring el表达式来控制授权,允许在表达式中使用复杂的布尔逻辑来控制访问的权限。 常见的表达式 Spring Security可用表达式对象的基类是SecurityExpressionRoot。 表达式描述hasRole([role])用户拥有制定的角色时返回true (Spring security默认会带有ROLE_前缀),去

浅析Spring Security认证过程

类图 为了方便理解Spring Security认证流程,特意画了如下的类图,包含相关的核心认证类 概述 核心验证器 AuthenticationManager 该对象提供了认证方法的入口,接收一个Authentiaton对象作为参数; public interface AuthenticationManager {Authentication authenticate(Authenti

Spring Security--Architecture Overview

1 核心组件 这一节主要介绍一些在Spring Security中常见且核心的Java类,它们之间的依赖,构建起了整个框架。想要理解整个架构,最起码得对这些类眼熟。 1.1 SecurityContextHolder SecurityContextHolder用于存储安全上下文(security context)的信息。当前操作的用户是谁,该用户是否已经被认证,他拥有哪些角色权限…这些都被保

Spring Security基于数据库验证流程详解

Spring Security 校验流程图 相关解释说明(认真看哦) AbstractAuthenticationProcessingFilter 抽象类 /*** 调用 #requiresAuthentication(HttpServletRequest, HttpServletResponse) 决定是否需要进行验证操作。* 如果需要验证,则会调用 #attemptAuthentica

Spring Security 从入门到进阶系列教程

Spring Security 入门系列 《保护 Web 应用的安全》 《Spring-Security-入门(一):登录与退出》 《Spring-Security-入门(二):基于数据库验证》 《Spring-Security-入门(三):密码加密》 《Spring-Security-入门(四):自定义-Filter》 《Spring-Security-入门(五):在 Sprin

Java架构师知识体认识

源码分析 常用设计模式 Proxy代理模式Factory工厂模式Singleton单例模式Delegate委派模式Strategy策略模式Prototype原型模式Template模板模式 Spring5 beans 接口实例化代理Bean操作 Context Ioc容器设计原理及高级特性Aop设计原理Factorybean与Beanfactory Transaction 声明式事物

这15个Vue指令,让你的项目开发爽到爆

1. V-Hotkey 仓库地址: github.com/Dafrok/v-ho… Demo: 戳这里 https://dafrok.github.io/v-hotkey 安装: npm install --save v-hotkey 这个指令可以给组件绑定一个或多个快捷键。你想要通过按下 Escape 键后隐藏某个组件,按住 Control 和回车键再显示它吗?小菜一碟: <template