m0_51459514的博客

原创 springboot之快速搭建业务层（service）

1.快速搭建接口package com.example.springboot_ssmp.service;import com.baomidou.mybatisplus.extension.service.IService;import com.example.springboot_ssmp.entity.User;// 通过继承IService<实体类>，使得不用手写增删改查分页等方法。IService已经写好了基本的方法，如需写其他方法，可以自己在下面加。public int

原创 springboot对数据库操作之按条件查询

// 按照条件查询 @Test void testGet() {// 使用方法为selectList所传对象为QueryWrapper<User> ，通过qw对象的方法设置条件。 QueryWrapper<User> qw =new QueryWrapper<>(); qw.like("username","杜甫"); userMapper.selectList(qw); }...

原创 spring整合SSMP

1.所需技术及作用（1）spring web（2）mybatis-plus:（3）lombok:（4）mysql driver

原创 springboot 整合lombok

1.为什么要用lombok？lombo可以简化实体类开发（简化get和set方法，toString方法，hashcode方法，equals方法）2.springboot 整合lombok（1）引入lombok<dependency> <groupId>org.projectlombok</groupId> <artifactId>lombok</artifactId></dependency>（2

原创 springboot 整合Druid

1.为什么要用Druiddruid是目前最高效的数据库连接池2.整合Druid2.1导入Druid对应的starter<!-- https://mvnrepository.com/artifact/com.alibaba/druid-spring-boot-starter --><dependency> <groupId>com.alibaba</groupId> <artifactId>druid-spring

原创 springboot 整合Mybaits-plus

1.为什么要用Mybaits-plus？你连sql增删改查语句都不用写，人家都写好了，只能说真香。2.整合Mybaits-plus（1）勾选Mybaits-plus，以及mysql 驱动（2）写实体类public class User { private Integer id; private String username; private String password; private String answer1; private Str

原创 springboot 整合Mybatis

1.勾选mybatis技术，勾选数据库驱动。2.数据连接信息转换为配置信息spring: datasource: driver-class-name: com.mysql.cj.jdbc.Driver url: jdbc:mysql://localhost:3306/boot_zhaopin?serverTimezone=UTC username: root password: root3.编写数据库映射public interface UserDao

原创 springboot 整合JUnit进行测试

1.位置src/test/java/com/example/demo_junit/DemoJunitApplicationTests.java2.注入你要测试的对象，使用自动装配的形式添加要测试的对象@SpringBootTestclass DemoJunitApplicationTests {// 1.注入你要测试的对象，使用自动装配的形式添加要测试的对象 @Autowired private BookDao bookDao; @Test void c

原创 yml数据的读取

1.单一数据的读取通过@Value("${一级属性名.二级属性名.三级属性名}")的方式调用代码实例：（1）具体调用@Value("${country}")private String country1;@Value("${user1.name}")private String name;@Value("${likes[2]}")private String like;@Value("${users[1].age}")private String age;（2）ym

原创 springboot指定配置文件

1.setting -> project structure -> Facets

原创 springboot 的属性配置

1.属性配置位置src/main/resources/application.properties2.属性配置的方式(3种)（1）application.propertiesspring.application.name=springboot_demo2server.port=80（2）application.yml（推荐使用）server: port: 80(3) application.yamlserver: port: 82...

原创 springboot控制器之RESTful快速开发

1.@RestController类注解2.@GetMapping @PostMapping @PutMapping @DeleteMapping 方法注解

原创 springboot的REST风格

按照REST风格访问资源时使用行为动作区分对资源进行何种操作http://localhost/users 查询全部用户信息 GET(查询)http://localhost/users/1 查询指定用户信息 GET(查询)http://localhost/users 添加用户信...

原创 springboot 的启动入口（引导类）的作用

// 引导类，作用是：启动后初始化spring容器，扫描引导类所在包加载bean@SpringBootApplicationpublic class Springboot0101QuickstartApplication { public static void main(String[] args) { SpringApplication.run(Springboot0101QuickstartApplication.class, args); }}...

原创 springboot pom.xml中的starter和parent

starterspringboot中常见项目名称，定义了当前项目使用的所有依赖坐标，以达到减少依赖配置的目的parent所有Springboot项目要继承的项目，定义了若干哥坐标号（依赖管理，而非依赖），以达到减少依赖冲突的目的。实际开发中的使用：一般只写groupId和artifactId，版本不用写，版本由SpringBoot提供。除非SpringBoot未提供版本。<dependency> <groupId>org.springframe...

原创 springboot基于阿里云的创建项目

原创 vue实现删除用户的操作

vue实现删除用户的操作

原创 ｖｕｅ实现修改用户信息的全过程

实现效果具体实现步骤：1.准备一个对话框，并在其中加入自己想要的表单，当点击修改按钮时，启用对话框<!-- 修改用户的对话框--><el-dialog title="修改用户" :visible.sync="editDialogVisible" width="50%" @close="editDialogClosed"> <el-form :model="editForm" :rules="editFormRules" ref.

原创 vue对整体表单数据预校验并提交到后台实现增加用户

1.为确认提交按钮添加点击事件<el-button type="primary" @click="addUser">确 定</el-button>2.编辑事件//点击按钮，添加用户addUser(){ // 进行表单的预校验,vaild为boolean值 this.$refs.addFormRef.validate( async valid =>{ // 校验失败，不走添加的逻辑 if (!valid) return;//校验成...

原创 vue实现关闭时表单清除

使用方法：clearValidate 移除表单项的校验结果。传入待移除的表单项的 prop 属性或者 prop 组成的数组，如不传则移除整个表单的校验结果 Function(props: array | string) 具体实现代码1.为会话框添加关闭事件<el-dialog title="添加用户" :visible.sync="addDialogVisible" width="50%" @close="addDialogClosed">2.在

原创 vue 通过自定义规则实现表单手机号和邮箱的校验

1.在data的最前面通过var定义变量来定义一个箭头函数data(){ //校验邮箱的规则 var checkEmail = (rule, value, callback) => { const reg=/^[A-Za-z0-9\u4e00-\u9fa5]+@[a-zA-Z0-9_-]+(\.[a-zA-Z0-9_-]+)+$/; if(!reg.test(value)){ callback(new Error('请输入有效的邮箱')); }

原创 vue通过对话框实现添加用户

1.按需注入组件,并挂载import {Dialog } from 'element-ui'Vue.use(Dialog)2.添加用户对话框<!--添加用户对话框--><el-dialog title="提示" :visible.sync="addDialogVisible" width="50%"> <!--内容主体区域--> <span>这是一段信息</span> <!-- 底部区域--

原创 vue搜索框的功能实现

1.搜索框和按钮<el-input placeholder="请输入内容" v-model="queryInfo.query" clearable @clear="getUserList"> <el-button slot="append" icon="el-icon-search" @click="getUserList" ></el-button></el-input>2.数据的双向绑定，通过查询参数进行搜索v-model="query

原创 vue 通过switch开关修改数据并存入数据库

Events事件名称 说明 回调参数 change switch 状态发生变化时的回调函数 新状态的值 1.在el-switch中添加change事件<el-switch v-model="slotProps.row.mg_state " @change="userStateChanged(slotProps.row)"></el-switch>2.编辑change事件调用的方法// 监听switch 开关状态的改变。asy

原创 vue的分页配置过程

1.总体el-pagination<el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="queryInfo.pagenum" :page-sizes="[1, 2, 5, 10]" :page-size="queryInfo.pagesize" layout="total, sizes, prev, pager, next, ju.

原创 vue通过作用域插槽实现通过判断数据的ｂｏｏｌｅａｎ值将表内的ｔｒｕｅ／ｆａｌｓｅ转换为开关图标。

注意：其中slotProps.row会获取本行的所有数据<el-table-column label="状态" > <!--作用域插槽会覆盖prop--> <template v-slot:default="slotProps"> <el-switch v-model="slotProps.row.mg_state "> </el-switch> </template></el-table-colu...

原创 vue实现二级菜单的持久高亮

使用属性default-active 当前激活菜单的 index string — — 具体实现代码1.动态改变default-active属性，想要将那个菜单设置高亮，将该菜单的index值赋值给default-active属性即可<el-menu :default-active="activePath">2.为该菜单设置点击事件<el-menu-item :index="'/'+subItem.path" v-for="subItem

原创 vue二级菜单页面的准备工作

1.在components中创建二级菜单的vue文件<template> <div> <h3>用户列表组件</h3> </div></template><script> export default { name: '' }</script><style scoped></style>2.在router的index中引入二级菜单的v

原创 vue将菜单改为路由链接

所用属性router 是否使用 vue-router 的模式，启用该模式会在激活导航时以 index 作为 path 进行路由跳转 boolean — false 具体实现代码1.在el-menu中添加router属性，router 等价于 :router="true"​​​​<el-menu background-color="#333744" text-color="#fff"active-text-color="#1495E7" unique-opene

原创 vue设置子路由并重新定向到子路由

1.在router下的index中添加以下代码import Welcome from '@/components/Welcome'{ path: '/home', name: 'home', component: Home, // 重定向到welcome redirect: '/welcome', // 添加子路由 children: [ { path: '/welcome', name: 'welcome', compon

原创 vue实现对左边菜单的折叠与展开

在el-menu中使用以下两种属性collapse 是否水平折叠收起菜单（仅在 mode 为 vertical 时可用） boolean — false collapse-transition 是否开启折叠动画 boolean — true 具体实现代码1.添加属性，并进行动态绑定即：，如果没有：则不识别。collapse-transition的存在是为了让折叠不卡顿。<el-menu background-color="#3337

原创 vue实现只保持一个子菜单的展开

vue实现只保持一个子菜单的展开

原创 vue 从后台获取菜单数据并表示在前端的过程

vue 从后台获取菜单数据并表示在前端的过程

原创 vue通过axios请求拦截，保证拥有获取数据的权限

1.拦截原因：访问需要授权的 API ，必须在请求头中使用 Authorization 字段提供 token 令牌，才能返回真实数据。2.拦截实现过程：在main.js 中添加如下代码：import axios from 'axios'// 设置请求的根路径axios.defaults.baseURL = 'http://127.0.0.1:8888/api/private/v1/'// axios 请求拦截，为请求头，添加token验证的Authorization字段// 拦截原因

原创 vue侧边栏菜单一二级模板

vue侧边栏菜单一二级模板

原创 vue实现后台页面实现退出功能

vue实现后台页面实现退出功能

原创 vue 通过路由导航守卫控制访问权限

vue 通过路由导航守卫控制访问权限

原创 vue实现登录成功后对token的保存以及跳转到后台页面

vue实现登录成功后对token的保存以及跳转到后台页面

原创 vue 中Message 消息提示

1.在element.js中引入Message 组件import { Button, Form, FormItem, Input, Message } from 'element-ui'2.在Vue原型对象上挂载弹窗组件，每个vue组件都可以通过this访问到Vue.prototype.$message = Message3.在vue文件中的methods中的相关方法中使用this.$message.error('登录失败');this.$message.success('登录成

原创 vue中axios的使用

vue中axios的使用