谷粒商城第九天-解决商品品牌问题以及前后端使用检验框架检验参数

目录

一、总述

二、商品分类问题

三、前端检验

四、后端检验

五、总结


一、总述

在完成完商品分类的时候,后来测试的时候还是发现了一些问题,现在将其进行解决,问题如下:

1. 取消显示的时候,如果取消了显示,再次想要其进行显示的时候发现不能再次被显示了。

2. 在修改页面发现是否显示按钮完全也是不起作用

另外从现在这个商品品牌修改页开始就要进行参数校验了,参数校验除了前端的参数校验还有后端的参数校验。

二、商品分类问题

1. 当取消显示,让其想再显示的时候,发现其不能再显示了。

其实这个问题出现的原因也是很简单,就是一旦选择了不显示之后,因为在后端进行了逻辑删除,因此,当不显示之后其实也就是进行了逻辑删除。一旦删除了过后,肯定再去找这个品牌对象,肯定也是找不到了,因此也就无法再去修改它的状态了。

解决办法:

取消其逻辑删除,MP的配置那里还有实体类里面的注解也要将其注释掉,将是否显示的这个字段变成一个标志字段

 2. 在修改页面的是否显示修改不起作用

原因就是,当初只记得单纯加上这个组件,但是忘记修改其默认的绑定值了,默认是false和true。

三、前端检验

之前前端校验是使用原生的js代码进行控制的,重复繁琐。

现在可以直接使用vue中为我们提供好的参数校验框架解决这个问题。

参考elementUI的表单组件,可以看到有表单验证组件:

步骤:

1. 先在表单上面加上校验的属性

 通过这个:rules绑定其校验的规则

2. 写校验规则

按照这个格式写好就行了。

也可以自定义校验,不使用它已经写好了的, 这个就需要查看下面的组件了,自定义校验规则

也就是这样:

还是像之前一样,只不过在里面另外加了个校验器,这个校验器就是一个方法。

使用callback()来显示异常的校验信息,当里面什么都不放的时候。就代表参数正常

在我的品牌管理中的修改和新增的那个页面,直接采用这种方法进行校验。

 其中数字还有一种简便的方式。

 这里我直接贴代码了:

dataRules: {
        name: [{ required: true, message: "品牌名不能为空", trigger: "blur" }],
        firstLetter: [
          {validator: (rule, value, callback) => {
              if(value == ''){
                callback(new Error('不能为空'));
              }else if(!/^[a-zA-Z]$/.test(value)){
                callback(new Error('首字母必须是字母'));
              }else{
                callback();
              }
          },trigger: "blur"}
        ],
        sort: [
          {validator : (rule, value, callback) => {
            if(value == ''){
              callback(new Error('不能为空'));
            }else if(!Number.isInteger(value)){
              callback(new Error('请输入数字'));
            }else{
              callback();
            }
          },trigger : "blur"}
        ]
      }

四、后端检验

后端校验也是必须的,看似前端就已经校验过一遍了,但是其实前端只是防了老实人,真正懂技术的,其实可以直接访问后端接口,那么此时后端就需要进行参数校验,但是之前的参数校验是直接使用大量的if条件进行判断的,很繁琐麻烦,很前端一样。

本次使用的参数校验的框架使用的是JSR303,validation框架

其实这个使用起来很简单,最简单的就是直接在参数对象所对应的类的字段上面添加上相应的注解,然后真正用的时候,在请求参数那里加上@valid注解代表启用参数校验,这就可以校验了。

首先在javax.validation.constraints包下面包含了许多的参数校验的注解,比如说非空,还有最大最小,邮箱地址判断等。

对于每个注解如果不熟悉的话,就可以查找这个文件:ValidationMessages_zh.properties这里面包含中文解释

常用的注解有:@NotEmpty(不能为空,包括不能是空字符串)、@Null(只能为空)、@Pattern(正则表达式)。

就像下面我这个使用了:

public class Brand implements Serializable {

    public static final long serialVersionUID = 1L;

    /** 品牌id */
    @TableId(value = "brand_id")
    @Null(message = "商品id必须为空",groups = {AddStatus.class})
    @Min(value = 0,message = "必须是大于0的整数",groups = {UpdateStatus.class})
    private Long brandId;

    /** 品牌名 */
    @Excel(name = "品牌名")
    @NotEmpty(message = "品牌名不能为空",groups = {AddStatus.class})
    private String name;

    /** 品牌logo地址 */
    @Excel(name = "品牌logo地址")
    @NotEmpty(message = "logo地址不能为空",groups = {AddStatus.class})
    @URL(message = "请输入合法的logo地址")
    private String logo;

    /** 介绍 */
    @Excel(name = "介绍")
    private String descript;

    /** 显示状态[0-不显示;1-显示] */
    @Excel(name = "显示状态[0-不显示;1-显示]")
    //@TableLogic(value = "1",delval = "0")
    @ValueList(vals = {0,1},groups = {AddStatus.class})
    private Integer showStatus;

    /** 检索首字母 */
    @Excel(name = "检索首字母")
    @Pattern(regexp = "^[a-zA-Z]$",message = "检索首字母必须为字母")
    @NotEmpty(message = "检索首字母不能为空",groups = {AddStatus.class})
    private String firstLetter;

    /** 排序 */
    @Excel(name = "排序")
    @Min(value = 0,message = "排序编号必须是一个大于0的整数")
    private Long sort;

}

 这是第一步,准备工作,但是要真正的启用参数校验,还需要启用参数校验:

在控制器的请求参数那里,就是请求的实体类的前面加上@Valid即可。

下面介绍这个校验框架的高级功能,有分组校验还有自定义参数校验注解

1. 分组校验

这个实际上很简单,因为在控制器的那里其实是有着许多控制器的,有个时候多个控制器其实是使用的相同的实体类的,这里的话不能对于任何的都使用一套校验规则,最简单的就是说,比如添加和修改,对于姓名等字段,添加是必须的,但是修改却并不是必须的。

步骤:

1. 先定义注解

这个注解只是起着标识的作用,就像@Override注解一样,里面什么内容都没有

2. 在实体类上面定义好注解与对应的接口进行绑定

只需要写上其注解对应的分组 

3. 在控制器那里直接也要标明状态

控制器这里要注意一下,不能依旧使用之前的@Valid注解了

需要使用@Validation注解,在里面写好value = 接口

下面是使用的效果:

这里的修改的时候其实是并没有加上name等字段的,但是也可以请求成功。原因就是那些字段是使用add注解进行绑定,而修改的话是与update进行绑定

2. 自定义校验注解

比如在这里我检验 是否显示的状态只能是 0和1 其他的不行

步骤:

1. 写一个校验注解

这里可以写上自己的文件,写上自己的提示信息

2. 写好校验器

点击validatedBy属性,可以发现校验器需要实现ConstraintValidator这个接口

这里我直接贴上这个检验器:

public class ValueListConstraintValidator implements ConstraintValidator<ValueList,Integer> {

    private Set<Integer> set = new HashSet<>();

    @Override
    public void initialize(ValueList constraintAnnotation) {
        int[] vals = constraintAnnotation.vals();
        for (int val : vals) {
            set.add(val);
        }
    }

    @Override
    public boolean isValid(Integer integer, ConstraintValidatorContext constraintValidatorContext) {
        return set.contains(integer);
    }
}

3. 在检验注解上面指定好校验器

然后就能直接进行使用了

下面是效果:

  

五、总结

这一次就是对商品的品牌进行了bug修复,另外还有就是前后端校验框架的使用,还是挺简单的,没什么技术含量的东西

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mfbz.cn/a/60856.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

java-IDEA MAVEN查看依赖树,解决jar包重复和冲突

如果这里面的依赖关系有红线,就说明有包冲突,一般都是版本不一致,可以在idea里下一个插件Maven Helper,点击install并重启IDEA 打开pom.xml文件&#xff0c;在下方会出现Dependency Analyzer&#xff0c;选择它会出现重复依赖列表&#xff0c;选择对应的依赖&#xff0c;右键红…

【小沐学前端】VuePress制作在线电子书、技术文档(VuePress + Markdown + node)

文章目录 1、简介1.1 VuePress简介1.2 它是如何工作的&#xff1f; 2、安装node3、安装VuePress4、配置VuePress4.1 修改标题4.2 修改导航条4.3 修改右侧栏4.4 修改正文 结语 1、简介 Vue驱动的静态网站生成器&#xff0c;生成的网页内容放到自己服务器上管理&#xff0c;可用于…

flutter开发实战-实现首页分类目录入口切换功能

。 在开发中经常遇到首页的分类入口&#xff0c;如美团的美食团购、打车等入口&#xff0c;左右切换还可以分页更多展示。 一、使用flutter_swiper_null_safety 在pubspec.yaml引入 # 轮播图flutter_swiper_null_safety: ^1.0.2二、实现swiper分页代码 由于我这里按照一页8…

shell指令的应用

整理思维导图判断家目录下&#xff0c;普通文件的个数和目录文件的个数输入一个文件名&#xff0c;判断是否为shell脚本文件&#xff0c;如果是脚本文件&#xff0c;判断是否有可执行权限&#xff0c;如果有可执行权限&#xff0c;运行文件&#xff0c;如果没有可执行权限&…

从URL取值传给后端

从URL传值给后端 http://127.0.0.1:8080/blog_content.html?id8点击浏览文章详情&#xff0c;跳转至详情页面 从 url 中拿出文章 id&#xff0c;传给后端 首先拿到url然后判断是否有值&#xff0c;从问号后面取值params.split(&) 以 & 作为分割然后遍历字符数组 param…

一百四十六、Xmanager——Xmanager5连接Xshell7并控制服务器桌面

一、目的 由于kettle安装在Linux上&#xff0c;Xshell启动后需要Xmanager。而Xmanager7版本受限、没有免费版&#xff0c;所以就用Xmanager5去连接Xshell7 二、Xmanager5安装包来源 &#xff08;一&#xff09;注册码 注册码&#xff1a;101210-450789-147200 &#xff08…

跑步蓝牙耳机哪种好、推荐几款专业跑步耳机

近年来&#xff0c;全民运动热潮逐渐兴起&#xff0c;运动耳机也成为各个年龄段的运动爱好者追捧的对象。作为一个热爱跑步的人&#xff0c;我可以负责任地告诉你&#xff0c;戴上耳机跑步会更加愉快。很多时候&#xff0c;运动的单调可能会让你产生放弃锻炼的想法&#xff0c;…

思科模拟器配置静态路由(下一跳使用IP)

Router0配置代码&#xff1a;##端口配置 Router(config)#int fastEthernet 0/0 Router(config-if)#ip address 192.168.10.254 255.255.255.0 Router(config-if)#no shutdown Router(config-if)#int fastEthernet 0/1 Router(config-if)#ip address 192.168.20.1 255.255.255.2…

ruoyi-cloud-notes02

1、Validated RequestBody 配合使用 Validated 和 RequestBody 都是 Spring Boot 中用于在请求中验证数据的注解。但是&#xff0c;它们的作用和使用方式略有不同。 Validated 用于在方法参数、URL、请求体、Map中的数据上进行验证&#xff0c;确保数据的有效性。它会在验证失…

vivo全球商城:电商交易平台设计

一、背景 vivo官方商城经过了七年的迭代&#xff0c;从单体架构逐步演进到微服务架构&#xff0c;我们的开发团队沉淀了许多宝贵的技术与经验&#xff0c;对电商领域业务也有相当深刻的理解。 去年初&#xff0c;团队承接了O2O商城的建设任务&#xff0c;还有即将成立的礼品中…

Java的变量与常量

目录 变量 声明变量 变量的声明类型 变量的声明方式&#xff1a;变量名 变量名的标识符 初始化变量 常量 关键字final 类常量 总结 变量和常量都是用来存储值和数据的基本数据类型存储方式&#xff0c;但二者之间有一些关键差别。 变量 在Java中&#xff0c;每个变…

人脸识别场景下Faiss大规模向量检测性能测试评估分析

在前面的两篇博文中&#xff0c;主要是考虑基于之前以往的人脸识别项目经历结合最近使用到的faiss来构建更加高效的检索系统&#xff0c;感兴趣的话可以自行移步阅读即可&#xff1a; 《基于facenetfaiss开发构建人脸识别系统》 Facenet算法的优点&#xff1a;高准确率&#…

Mac提示文件:已损坏,无法打开。你应该把它移到废纸篓

文章目录 一、电脑信息二、打开任何来源设置三、更改应用程序拓展属性 一、电脑信息 我的是新版的Venture 13的系统。UI改的比较多。与之前的配置还是有很大的区别的。 打开下载的软件&#xff0c;显示已经损坏&#xff0c;打不开。抛开软件本身的问题外&#xff0c;一般是Ma…

第一百二十二天学习记录:C++提高:STL-vector容器(上)(黑马教学视频)

vector基本概念 功能&#xff1a; vector数据结构和数组非常相似&#xff0c;也称为单端数组 vector与普通数组区别&#xff1a; 不同之处在于数组是静态空间&#xff0c;而vector可以动态扩展 动态扩展&#xff1a; 并不是在原空间之后续接新的空间&#xff0c;而是找更大的内…

PHP国外在线教育系统源码 在线课程系统源码 直播课程系统源码提供在线课程,现场课程,测验

Proacademy是在线教育一体化的解决方案&#xff0c;用于创建类似于Udemy、Skillshare、Coursera这种在线教育市场。 这个平台提供在线课程&#xff0c;现场课程&#xff0c;测验等等&#xff0c;并有一个基于实际业务需要的高级认证插件&#xff0c;程序基于Laravel强大的安全框…

Spring Boot 中自动装配机制的原理

问题描述 自动装配&#xff0c;简单来说就是自动把第三方组件的 Bean 装载到 Spring IOC 器里面&#xff0c;不需 要开发人员再去写 Bean 的装配配置。 在 Spring Boot 应用里面&#xff0c;只需要在启动类加上SpringBootApplication 注解就可以实现自动装配。 SpringBootAppli…

小程序学习(四):WXML模板语法

WXML模板语法-数据绑定 1.数据绑定的基本原则 ①在data中定义数据 ②在WXML中使用数据 2.动态绑定属性 WXML模板语法-事件绑定 3.什么是事件 4.小程序中常用的事件 5.事件对象的属性列表 6.target和currentTarget的区别 7.bindtap的语法格式 8.在事件处理函数中为data中的数据…

11.物联网操作系统内存管理

一。STM32编译过程及程序组成 STM32编译过程 程序的组成、存储与运行 MDK生成的主要文件分析 1.STM32编译过程 1.源文件&#xff08;Source code&#xff09;--》目标文件&#xff08;Object code&#xff09; .c(C语言)通过armcc生成.o&#xff0c;.s&#xff08;汇编&…

xcode 的app工程与ffmpeg 4.4版本的静态库联调,ffmpeg内下的断点无法暂停。

先阐述一下我的业务场景&#xff0c;我有一个iOS的app sdk项目&#xff0c;下面简称 A &#xff0c;以及运行 A 的 app 项目&#xff0c;简称 A demo 。 引用关系为 A demo 引用了 A &#xff0c;而 A 引用了 ffmpeg 的静态库&#xff08;.a文件&#xff09;。此时业务出现了 b…

Android 从LibVLC-android到自编译ijkplayer播放H265 RTSP

概述 ijkplayer: Android/iOS video player based on FFmpeg n3.4, with MediaCodec, VideoToolbox support. 官方的描述就这么简单的一句话&#xff0c;但丝毫都不影响它的强大。 从LibVLC 到 ijkplayer 截止到2023.7.20 LibVLC-Android 最大的问题在与OOM&#xff0c;测试了…
最新文章