- 博客(81)
- 收藏
- 关注
RSS订阅原创 vue3.0 引入bootstrap 4
jQuery安装jQuery 和 popper.jsnpm install --save jquerynpm install --save popper.js安装bootstrapnpm install bootstrap@4 --save在main.js中引入import $ from 'jquery';import "bootstrap";import "bootstrap/dist/css/bootstrap.min.css";import "bootstrap/dist/j
2020-09-28 14:08:49
1660
原创 vue3.0 配置跨域
在项目的根目录下创建一个vue.config.js：vue.config.js:module.exports = { devServer: { port: 8023, // 端口 proxy: { '/api': { //请求路径关键字 target: 'http://localhost:8024/management/', //对应自己的接口 changeOrigin: t
2020-09-22 14:07:14
13774
原创 element UI使用el-container布局时 丢失el-header 和 el-footer
在element UI使用el-container布局时将 el-header ，el-main ，el-footer封装成组件，导致丢失了布局样式，导致布局错误官网文档：封装成组件后，el-container中没有了el-footer，el-main和el-header，导致子元素排列方向默认为horizontal问题解决在el-container上增加 direction="vertical"属性...
2020-09-22 09:44:19
2795
2
原创 vue elementUI dialog弹框中使用表单 表单无法重置
用 nextTick 处理一下form的数据：this.$nextTick(() => { this.student = student; })然后在关闭dialog 时调用重置方法:this.$refs[student].resetFields();完整代码：<el-dialog title="添加学生信息" :visible.sync="dialogFormVisible" width="32%" :center="true" top="20px">
2020-08-24 16:19:09
1335
原创 Element UI 使用 前后端数据对接 添加 删除 修改
<el-container style="height: 500px; border: 1px solid #eee"> <!-- el-container 构建整个页面框架 --> <el-aside width="200px" style="background-color: rgb(238, 241, 246)"> el-aside 构建左侧菜单 <el
2020-08-07 14:00:38
1733
原创 前后端分离 获取数据
先建立一个前端vue项目：然后在views下新建一个User.vue:先手动填入一些假的数据<template> <div> <table> <tr> <td>编号</td> <td>用户名</td> <td>密码</td>
2020-08-06 12:41:15
2752
原创 返回当前登录用户名 路由模式 404 路由钩子与异步请求
在login.vue中 登录表单请求时传递个name属性 将用户名传递到 /main：this.$router.push("/main/"+this.from.username);methods:{ onSubmit(formName){ //为表单绑定验证功能 this.$refs[formName].validate((valid)=>{ if(valid){ //使用vue-router路由到指定界
2020-08-05 12:00:31
208
原创 参数传递 重定向
设置v-bind:to 属性，传入参数id<!-- name：传组件名 params: 传递参数 需要对象 要用v-bind: --> <router-link :to="{name: 'UserProfile',params: {id: 1}}">个人信息</router-link>在路由中绑定参数：index.js:children: [ {path: '/user/profile/:id',name: 'UserProfile'
2020-08-05 09:41:52
477
原创 路由嵌套
在上一代码的基础上 ：创建 views.user.Profile.vue:<template> <h1>个人信息</h1></template><script> export default { name: "UserProfile" }</script><style scoped></style>创建 views.user.List.vue:&l
2020-08-03 19:04:14
101
转载 Vue + ElementUI
创建工程:1、创建一个名为hello-vue的工程vue init webpack hello-vue2、安装依赖， 我们需要安装vue-router、element-ui、sass-loader和node-sass四个插件#进入工程目录cd hello-vue#安装vue-routern npm install vue-router --save-dev#安装element-uinpm i element-ui -S#安装依赖npm install# 安装SASS加载器cnpm
2020-08-03 18:58:49
136
转载 vue-router路由
Vue Router是Vue.js官方的路由管理器。它和Vue.js的核心深度集成， 让构建单页面应用变得易如反掌。包含的功能有：嵌套的路由/视图表模块化的、基于组件的路由配置路由参数、查询、通配符基于Vue js过渡系统的视图过渡效果细粒度的导航控制带有自动激活的CSS class的链接HTML5 历史模式或hash模式， 在IE 9中自动降级自定义的滚动行为安装：基于第一个vue-cli进行测试学习； 先查看node modules中是否存在vue-router vue-rou
2020-08-03 16:25:48
94
转载 第一个vue-cli项目
什么是vue-cli:vue-cli官方提供的一个脚手架，用于快速生成一个vue的项目模板；预先定义好的目录结构及基础代码，就好比咱们在创建Maven项目时可以选择创建一个骨架项目，这个估计项目就是脚手架，我们的开发更加的快速；需要的环境:Node.js：http://nodejs.cn/download/ 安装就是无脑的下一步就好，安装在自己的环境目录下Git：https://git-scm.com/doenloads 镜像：https://npm.taobao.org/mirrors
2020-08-03 16:19:21
131
转载 计算属性 内容分发 自定义事件
计算属性:计算属性的重点突出在属性两个字上(属性是名词)，首先它是个属性其次这个属性有计算的能力(计算是动词)，这里的计算就是个函数：简单点说，它就是一个能够将计算结果缓存起来的属性(将行为转化成了静态的属性)，仅此而已；可以想象为缓存!<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> &l
2020-08-03 13:27:57
168
原创 Vue组件
什么是组件：组件是可复用的Vue实例， 说白了就是一组可以重复使用的模板， 跟JSTL的自定义标签、Thymeleal的th:fragment等框架有着异曲同工之妙，通常一个应用会以一棵嵌套的组件树的形式来组织第一个Vue组件：使用Vue.component()方法注册组件，格式如下：<body><div id="app"></div></body><script> //定义一个Vue组件component Vu
2020-08-02 12:32:53
164
转载 vue双向数据绑定
什么是双向数据绑定：Vue.js是一个MV VM框架， 即数据双向绑定， 即当数据发生变化的时候， 视图也就发生变化， 当视图发生变化的时候，数据也会跟着同步变化。这也算是Vue.js的精髓之处了。 值得注意的是，我们所说的数据双向绑定，一定是对于UI控件来说的非UI控件不会涉及到数据双向绑定。单向数据绑定是使用状态管理工具的前提。如果我们使用vue x那么数据流也是单项的，这时就会和双向数据绑定有冲突。 为什么要实现数据的双向绑定：在Vue.js中，如果使用vuex， 实际上数据还是单向的，
2020-08-01 19:31:40
119
原创 vue
Vue七大常用属性el属性： 用来指示vue编译器从什么地方开始解析 vue的语法，可以说是一个占位符。 data属性 用来组织从view中抽象出来的属性，可以说将视图的数据抽象出来存放在data中。 template属性 用来设置模板，会替换页面元素，包括占位符。 methods属性 放置页面中的业务逻辑，js方法一般都放置在methods中 render属性 创建真正的Virtual Dom computed属性 用来计算 watch属性 watch:functi
2020-08-01 19:06:37
134
原创 线程
并发与并行 ：并发：指两个或多个事件在同一个时间段内发生。 并行：指两个或多个事件在同一时刻发生（同时发生）。线程与进程 ：进程：是指一个内存中运行的应用程序， 每个进程都有一个独立的内存空间，一个应用程序可以同时运行多 个进程； 进程也是程序的一次执行过程，是系统运行程序的基本单位； 系统运行一个程序即是一个进程从创 建、运行到消亡的过程。 线程：线程是进程中的一个执行单元，负责当前进程中程序的执行， 一个进程中至少有一个线程。一个进程 中是可以有多个线程的， 这个应用程序也可以
2020-08-01 12:25:26
106
原创 异步任务，定时任务，邮件任务
创建一个service包：创建一个类AsyncService：编写方法，假装正在处理数据，使用线程设置一些延时，模拟同步等待的情况；@Servicepublic class AsyncService { public void hello(){ try { Thread.sleep(3000); } catch (InterruptedException e) { e.printStackTrace(); }
2020-07-31 20:21:59
147
转载 spring 定时 @Scheduled注解
参数:cron该参数接收一个**cron**表达式，cron表达式是一个字符串，字符串以5或6个空格隔开，分开共6或7个域，每一个域代表一个含义。cron表达式语法:[秒] [分] [小时] [日] [月] [周] [年][年]不是必须的域，可以省略[年]，则一共6个域通配符说明:* 表示所有值。 例如:在分的字段上设置 *,表示每一分钟都会触发。? 表示不指定值。使用的场景为不需要关心当前设置这个字段的值。 例如:要在每月的10号触发一个操作，但不关心是周几， 所以需要周位
2020-07-31 20:21:24
965
1
转载 swagger
Swagger简介:号称世界上最流行的API框架Restful Api 文档在线自动生成器 => API 文档 与API 定义同步更新直接运行，在线测试API支持多种语言 （如：Java，PHP等）官网：https://swagger.io/SpringBoot集成Swagger:添加Maven依赖:<dependency> <groupId>io.springfox</groupId> <artifactId>
2020-07-31 16:55:37
137
原创 idea 2020取消Import Maven projects automatically
idea推出2020 版本以后 ，取消了maven 原本的自动加载依赖的设置，新版本在修改pom.xml后：点击右上角的M即可更新
2020-07-31 13:24:22
5863
5
原创 shiro整合thymeleaf
在pom.xml中添加：<!--shiro整合thymeleaf的包--> <dependency> <groupId>com.github.theborakompanioni</groupId> <artifactId>thymeleaf-extras-shiro</artifactId> <version>2.0.0</ver
2020-07-31 10:49:38
129
原创 shiro授权操作
ShiroConfig：先设置相应权限操作 perms:拥有对某个资源的权限才能访问；//设置权限, filterMap.put("/user/add","perms[user:add]"); filterMap.put("/user/update","perms[user:update]");添加一个页面 提示未授权“未经授权，无法访问页面”MyController：@RequestMapping("/noauth") @Response
2020-07-31 10:29:37
447
原创 shiro 整合mybatis
pom.xml <!--mysql--> <dependency> <groupId>mysql</groupId> <artifactId>mysql-connector-java</artifactId> </dependency> <dependency> <groupId>
2020-07-30 15:43:59
170
原创 Shiro
Apache Shiro 是 Java 的一个安全框架。Shiro 可以非常容易的开发出足够好的应用，其不仅可以用在 JavaSE 环境，也可以用在 JavaEE 环境。Shiro 可以帮助我们完成：认证、授权、加密、会话管理、与 Web 集成、缓存等。这不就是我们想要的嘛，而且 Shiro 的 API 也是非常简单；其基本功能点如下图所示：Authentication：身份认证 / 登录，验证用户是不是拥有相应的身份；Authorization：授权，即权限验证，验证某个已认证的用户是否拥有某个权
2020-07-29 21:01:36
108
原创 集成SpringSecurity
Spring Security是一个功能强大且高度可定制的身份验证和访问控制框架。它实际上是保护基于spring的应用程序的标准。Spring Security是一个框架，侧重于为Java应用程序提供身份验证和授权。与所有Spring项目一样，Spring安全性的真正强大之处在于它可以轻松地扩展以满足定制需求。认识SpringSecuritySpring Security 是针对Spring项目的安全框架，也是Spring Boot底层安全模块默认的技术选型，他可以实现强大的Web安全控制，对于安全
2020-07-29 16:19:51
139
原创 整合Druid
Druid简介:Java程序很大一部分要操作数据库，为了提高性能操作数据库的时候，又不得不使用数据库连接池。Druid 是阿里巴巴开源平台上一个数据库连接池实现，结合了 C3P0、DBCP 等 DB 池的优点，同时加入了日志监控。Druid 可以很好的监控 DB 池连接和 SQL 的执行情况，天生就是针对监控而生的 DB 连接池。com.alibaba.druid.pool.DruidDataSource 基本配置参数如下：:配置数据源1、添加上 Druid 数据源依赖。： <dep
2020-07-29 09:45:12
250
原创 整合JDBC
创建项目，导入： <!-- JDBC--> <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-jdbc</artifactId> </dependency> <!--mysql-->
2020-07-29 09:33:35
76
转载 Docker基本使用
Docker是一个开源的应用容器引擎；是一个轻量级容器技术；Docker支持将软件编译成一个镜像；然后在镜像中各种软件做好配置，将镜像发布出去，其他使用者可以直接使用这个镜像；运行中的这个镜像称为容器，容器启动是非常快速的。核心概念：docker主机(Host)：安装了Docker程序的机器（Docker直接安装在操作系统之上）；docker客户端(Client)：连接docker主机进行操作；docker仓库(Registry)：用来保存各种打包好的软件镜像；docker镜像(Imag
2020-07-28 17:17:46
100
转载 使用thymeleaf公共页面元素抽取 日期格式修改
语法:~{templatename::selector}：模板名::选择器~{templatename::fragmentname}:模板名::片段名/*公共代码片段*/<footer th:fragment="copy" id="copy"> © 2011 The Good Thymes Virtual Grocery</footer>/*引用代码片段 方法一 使用片段名*/<div th:insert="~{footer ::
2020-07-28 14:50:07
241
原创 登录 拦截
实现登录功能：@Controllerpublic class LoginController { @PostMapping(value = "/user/login") public String login( @RequestParam("username") String username, @RequestParam("password") String password, Model model, Http
2020-07-27 21:27:30
220
原创 i18n国际化
1.编写国际化配置文件，抽取页面需要显示的国际化消息：SpringBoot自动配置好了管理国际化资源文件的组件@Configuration(proxyBeanMethods = false)@ConditionalOnMissingBean( name = {"messageSource"}, search = SearchStrategy.CURRENT)@AutoConfigureOrder(-2147483648)@Conditional({MessageSourceA
2020-07-27 18:19:40
374
原创 thymeleaf
Thymeleaf 官网Thymeleaf 在Github 的主页pom.xml：<!--thymeleaf--><dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-thymeleaf</artifactId></dependency>首先得按照SpringBoot的自动
2020-07-27 10:40:32
95
原创 静态资源处理 页面图标修改
静态资源访问：总结：在springboot中，可以使用以下方式处理静态资源：1.webjars： 访问地址：http://localhost:8080/webjars/2. public ， static， /**， resource， 访问地址：http://localhost:8080/优先级：resource > static(默认) > public页面图标修改；(1) 2.2.x 前的版本在此之前版本下默认是有一个默认的 favicon.ico 文件的，也就是
2020-07-27 09:52:56
225
原创 多环境切换
profile是Spring对不同环境提供不同配置功能的支持，可以通过激活不同的环境版本，实现快速切换环境；配置文件我们在主配置文件编写的时候，文件名可以是 application-{profile}.properties/yml , 用来指定多个环境版本；例如：application-test.properties 代表测试环境配置application-dev.properties 代表开发环境配置但是Springboot并不会直接启动这些配置文件，它默认使用application.pr
2020-07-26 18:41:26
624
原创 JSR303数据校验
Springboot中可以用@validated来校验数据，如果数据异常则会统一抛出异常，方便异常中心统一处理。我们这里来写个注解让我们的name只能支持Email格式；、@Component //注册bean@ConfigurationProperties(prefix = "person")@Validated //数据校验public class Person { @Email(message="邮箱格式错误") //name必须是邮箱格式 //message可以省略不写
2020-07-26 18:10:30
124
原创 yaml（1）
配置文件SpringBoot使用一个全局的配置文件 ， 配置文件名称是固定的application.properties语法结构 ：key=valueapplication.yml语法结构 ：key：空格 value配置文件的作用 ：修改SpringBoot自动配置的默认值，因为SpringBoot在底层都给我们自动配置好了；比如我们可以在配置文件中修改Tomcat 默认启动的端口号！测试一下！server.port=8081YAML是 “YAML Ain’t a Markup La
2020-07-26 17:43:48
127
原创 Caused by: java.lang.ClassNotFoundException: org.junit.platform.launcher.TestExecutionListener
使用springboot自带测试类报错：Exception in thread "main" java.lang.NoClassDefFoundError: org/junit/platform/launcher/TestExecutionListener at java.lang.ClassLoader.defineClass1(Native Method) at java.lang.ClassLoader.defineClass(ClassLoader.java:763) at java.sec
2020-07-26 16:55:08
3484
1
原创 spring boot
自动配置：pom.xml:父依赖:其中它主要是依赖一个父项目，主要是管理项目的资源过滤及插件！<parent> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-parent</artifactId> <version>2.2.5.RELEASE</version> <relat
2020-07-26 15:45:19
80
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人