陆源东-优快云博客

原创 No.25 K个一组反转链表

25. K个一组反转链表/** * Definition for singly-linked list. * public class ListNode { * int val; * ListNode next; * ListNode() {} * ListNode(int val) { this.val = val; } * ListNode(int val, ListNode next) { this.val = val; this.next =

2021-09-18 00:18:24 170

原创 npm命令解释

npm命令解释npm install moduleName安装模块到项目目录下npm install -g moduleName将模块安装到全局npm install -save moduleName将模块安装到项目目录下，并在package文件的dependencies节点写入依赖缩写为-Snpm install -save-dev moduleName将模块安装到项目目录下，并在package文件的devDependencies节点写入依赖缩写为-D.

2021-07-20 13:01:56 157

原创 19.命名视图

19.命名视图有时候想同时 (同级) 展示多个视图，而不是嵌套展示，例如创建一个布局，有 sidebar (侧导航) 和 main (主内容) 两个视图，这个时候命名视图就派上用场了。你可以在界面中拥有多个单独命名的视图，而不是只有一个单独的出口。如果 router-view 没有设置名字，那么默认为 default。<router-view class="view one"></router-view><router-vie

2021-07-20 13:01:11 176

原创 18.参数传递及重定向

18.参数传递及重定向流程main.vue通过router-link将参数连同路由信息传递到router的index.jsrouter将参数传递给要跳转的视图组件代码示例main.vue<el-menu-item-group> <el-menu-item index="1-1"> <!-- 1.通过 :to 可以通过双向数据绑定将参数id绑定到此router-link对应的组件上，使得组件可以取出参数的值 2.在这里通过name进行rou

2021-07-20 13:00:42 417 2

原创 17.编程式导航

17.编程式导航this.$router.push(location,onComplete?onAbort?)this.$router.replace(location,onComplete?onAbort?)this.$router.go(steps) 除了使用<router-link>创建a标签来定义导航链接，还可以使用router的实例方法，通过编写代码来实现使用router.push(location,onComplete?,onAbort?) 在Vue实例内

2021-07-20 13:00:01 151

原创 16.嵌套路由

16.嵌套路由如上图，组件main下可以由多个组件如Profile、Post共同组成一个Vue界面。而不是一个组件代表一个页面，只能够给产生页面的跳转多个组件共同组合为一个页面代码示例按照目录结构添加文件list.vue<template><h1>用户列表页</h1></template><script>export default { name:

2021-07-20 12:59:40 98

原创 15.Vue+ElementUI

15.Vue+ElementUI官方文档https://element.eleme.cn/#/zh-CN/component/installation安装部署 1.npm方式npm i element-ui -S 2.CDN方式目前可以通过 unpkg.com/element-ui 获取到最新版本的资源，在页面上引入 js 和 css 文件即可开始使用。<link rel="stylesheet" href="https://unpkg.c

2021-07-20 12:58:35 135

原创 13.Webpack

13.Webpack Webpack是一个JavaScript应用程序的静态模块打包器，当webpack处理应用程序的时候，会递归地构建一个依赖关系图，其中包含了应用程序所需要地每个模块，然后将这些模块打包为一个bundleWebpack使用的迫切性在前端化工程中，许多关键命令需要使用JavaScript ES6的新特性。然而许多浏览器并不支持ES6，这个时候就需要webpack能够将ES6打包为ES5工程Webpack安装npm install webpack -gnpm inst

2021-07-20 12:57:33 91

原创 11. 自定义事件内容分发

11. 自定义事件内容分发如slot示例代码中，如何通过操作组件删除掉ViewModel的源数据代码呢？ViewModel自己通过method删除DOM<script>var vm = new Vue({ el : "#app", data : { title : '选择你的英雄', items : ['高等数学','线性代数','摆烂'] }, methods : { //ViewModel的方法 removeItems : function(

2021-07-20 12:55:01 103

原创 10.slot插槽

10.slot插槽slot 是一个标签,位于组件之中的一个标签，作用是提供一个插槽，被其他数据所插入 ,可以实现数据互相组合插入的效果<body><div id="app"> <slot>   <slot-title slot="slot-t

2021-07-20 12:54:29 181

原创 7.Axios异步通信

7.Axios异步通信 Axios是一个开源的，用在浏览器端和NodeJS的异步通信框架。主要作用是实现Ajax异步通信主要特点从浏览器创建XMLHttpRequests从node.js创建http请求支持Promise API [JS链式编程]拦截请求和响应转换请求数据和响应数据取消请求自动转换JSON数据客户端支持资料及下载地址GitHib ： https://github.com/axios/axios中文文档： http://www.axios-js.com/

2021-07-20 12:52:16 132

原创 6.Vue组件

6.Vue组件组件是可复用的Vue实例，一组可重复的模板组件简单编写<body> <div id="component">  <luyuandong></luyuandong> </div><script> //定义一个Vue组件，名字为luyuandong Vue.component('luyuandong',{ te

2021-07-20 12:51:48 106

原创 5.Vue双向数据绑定

5.Vue双向数据绑定什么是双向数据绑定 Vue.js是一个MVVM框架，数据发生变化的时候，视图也发生变化。视图发生变化，数据也会同步变化双向数据绑定针对于UI组件双向数据绑定的好处在Vue.js中，如果使用vuex，实际上数据还是单向的。但是对于UI控件来说，是数据双向绑定的，因此对于表单可以使用双向数据绑定来降低开发难度。在表单中使用双向数据绑定使用v-model指令在表单input 、textarea 、select等元素上创建双向数据绑定，将会根据控件的类型自动选取正确的

2021-07-20 12:51:14 95

原创 4.Vue绑定事件

4.Vue绑定事件v-on指令简写：@<body><div id="app"> <button v-on:click="hello">click</button> </div><script> var vm = new Vue({ el : "#app", data : { message : 'he

2021-07-20 12:50:23 81

原创 3.Vue基本语法

3.Vue基本语法v-bind （v-指令）简写：: 使用v-bind属性来绑定属性<!DOCTYPE html><html lang="en" xmlns:v-bind="http://www.w3.org/1999/xhtml"><head> <meta charset="UTF-8"> <title>v-bind练习</title> <script src="https://cdn.js

2021-07-20 12:49:53 101

原创 2.Vue的第一个程序

2.Vue的第一个程序1.MVVMModel-View-ViewModel ，一种软件架构设计模式。源于MVC模式，MVVM的核心是ViewModel层，负责转换Model中的数据对象来让对象变得更容易管理和使用。向上与视图层进行双向数据绑定向下与Model层通过接口请求进行数据交互优势低耦合：视图（View）可以独立于Model的变化和修改，一个ViewModel可以绑定到不同的View上，当View变化的时候Model可以保持不败你，当Model变化的时候View也可以保持不变

2021-07-20 12:49:17 81

原创 1.Vue

1.Vue一套用于构建用户界面的渐进式JavaScript框架，只关心视图层的构建网络通信： axios页面跳转： vue-router状态管理： vuex前端技术结构层（HTML）表现层（CSS）缺点：语法不够强大，无法嵌套书写，导致模块化开发中要重复书写选择器没有变量和合理的样式复用机制，难以维护CSS预处理器：定义了一种新的语言，为CSS增加了编程特性。将CSS作为目标生成文件，开发者使用这种语言进行CSS的编码，最终生成CSS文件使用SAS

2021-07-20 12:48:32 118

原创 16.SpringMVC实现上传下载

16.SpringMVC实现上传下载SpringMVC为文件上传提供了专门的支持，即插即用的MulitpartResolver文件上传1.导入依赖<dependency> <groupId>commons-fileupload</groupId> <artifactId>commons-fileupload</artifactId> <version>1.4</version></

2021-07-03 23:51:57 87

原创 15.处理器拦截器实现登陆验证

15.处理器拦截器实现登陆验证编写登录页面与首页index.jsp 通过这个页面进入登录页面与首页，如果不登陆的话，不可以进入首页<%@ page contentType="text/html;charset=UTF-8" language="java" %><html><head> <title>Title</title> <script src="https://cdn.bootcdn.net/ajax/libs

2021-07-03 23:51:30 143

原创 14.处理器拦截器

14.处理器拦截器SpringMVC的处理器拦截器类似于Serlvet中的过滤器Filter , 用于对处理器进行预处理和后处理，是AOP思想的具体应用1.过滤器与拦截器的区别过滤器在servlet规范中，任何的JavaWeb工程都可以使用在url-pattern中配置==/*==之后，可以对所有资源进行拦截拦截器拦截器是SpringMVC框架的，只有SpringMVC工程可以使用拦截器只会拦截访问的控制器方法，不会拦截资源与jsp2.实现编写拦截器类package

2021-07-03 23:50:51 141

原创 13. Ajax验证用户名

13. Ajax验证用户名13.1 Controllerpackage com.liu.controller;import com.liu.pojo.User;import org.apache.ibatis.annotations.Param;import org.springframework.web.bind.annotation.RequestMapping;import org.springframework.web.bind.annotation.RestController;im

2021-07-03 23:50:21 91

原创 12.Ajax异步加载数据

12.Ajax异步加载数据12.1 导入依赖 (json通常使用jackson)<?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.or

2021-07-03 23:49:50 71

原创 11.Ajax

11.Ajax不需要刷新网页情况下实现局部更新的一种技术例如：11.1.使用iframe标签模拟Ajax弹窗（只是模拟，网址会刷新）一个固定的弹窗<%@ page contentType="text/html;charset=UTF-8" language="java" %><html><head> <title>体验页面无刷新</title></head><body><iframe s

2021-07-03 23:49:22 409

原创 10.整合SSM

10.整合SSM10.1 构建maven项目导入依赖 + 静态资源过滤配置pom文件<?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.

2021-07-03 23:48:02 192 2

原创 --8--.乱码配置

–8--.乱码配置8.1 Tomcat编码配置tomcat/config/setting/server.xml 文件<Connector URIEncoding="utf-8" port="8080" protocol="HTTP/1.1" connectionTimeout="20000" redirectPort="8443" />8.2 自定义过滤器import javax.servlet.*;import javax.servle

2021-07-03 23:46:43 65

原创 9.JSON

9.JSON9.1 什么是JSON 一种轻量级的数据交换格式，使用完全的文本来存储和表示数据9.2 JavaScript与JSON 在JavaScript中，一切皆为对象。任何JavaScript支持的类型都可以用JSON来表示。 JSON是JavaScrip对象的字符串表示法，使用文本来表示一个JS对象，本质是一个字符串 JSON键值对： “{“a”:“Hello”,“b”:“world!”}”对象属性表示为键值对，数据由逗号分隔花括号保存对象方括号保存数组9.3

2021-07-03 23:46:05 132

原创 8.参数接收与数据回显

8.参数接收与数据回显8.1 处理前端起脚数据1.如果提交参数的name和Controller的参数name一样，就会直接获取到<%@ page contentType="text/html;charset=UTF-8" language="java" %><html> <head> <title>Index</title> </head> <body> <form action=/te

2021-07-03 23:45:24 823

原创 7.重定向与转发

7.重定向与转发7.1SpringMVC结果跳转方式页面：视图解析器前缀 + viewName + 视图解析器后缀例如： /WEB-INF/jsp/ + hello + .jsp7.2 重定向与转发1.使用request与response@Controllerpublic class TestController{ //模板URL ，会直接通过 / 的形式绑定a与b @GetMapping("test/{a}/{b}") public String test(Ht

2021-07-03 23:44:47 101

原创 6.ResuFul风格

6.ResuFul风格一种资源定位与资源操作的风格，更加简洁、更加有层次，对于缓存机制更友好。6.1 与正常风格比较的不同正常风格： localhost:8080/method?name=陆源东RestFul风格： localhost:8080/method/name/陆源东6.2 实例传统资源操作方式postget通过不同的参数实现不同的功能http://127.0.0.1/item/queryItem.action?id=1 GET方法查询http://127.0.0.1

2021-07-03 23:43:39 238

原创 5.Controller配置总结

5.Controller配置总结5.1 控制器Controller控制器提供访问应用程序的行为，可以通过接口或注解定义两种方法实现控制器负责解析用户的请求并转化为一个Model在SpringMVC中一个控制器可以包含多个方法5.2 实现Controller得到两种方式接口实现spring配置 - 手动配置映射器与适配器<?xml version="1.0" encoding="UTF8"?><beans xmlns="http://www.springframew

2021-07-03 23:43:09 537

原创 4.使用注解进行SpringMVC开发

4.使用注解进行SpringMVC开发0.在Project Structure添加jar1.配置web.xml<?xml version="1.0" encoding="UTF-8"?><web-app xmlns="http://xmlns.jcp.org/xml/ns/javaee" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http:/

2021-07-03 23:42:32 78

原创 3.Spring-MVC执行原理

3.Spring-MVC执行原理执行原理图示执行原理详图执行流程分析DispatcherServlet表示前置控制器，是整个SpringMVC的控制中。用户发出请求，DispatcherServlet接受请求并拦截url ： http://localhost:8080/SpringMVC/hellohttp://localhost:8080 ：服务器域名SpringMVC是部署在服务器上的web站点hello表示控制器Controllerurl ：请求位于服务器localh

2021-07-03 23:41:14 73

原创 2.Spring-MVC搭建

2.Spring-MVC搭建1. 新建web项目2.导入依赖（同时解决资源过滤问题）<dependencies>  <dependency> <groupId>junit</groupId> <artifactId>junit</artifactId>

2021-07-03 23:38:58 74

原创 1.SpringMVC

1.SpringMVC基于Java实现的轻量级web框架什么是MVC?模型层（Model）： dao、service 提供要展示的数据，包含要展示的数据和行为，通常分为：数据层（Dao）和服务层（Service）。视图（View）: 前端进行模型的展示控制器（Controller）： servlet 接受用户请求，委托给模型进行处理，处理之后把返回的模型数据交给视图层。典型例子： JavaBean + JSP + ControllerMVC架构发展历程Model1只

2021-07-03 23:38:22 78

原创 14. Spring事物管理器

14. Spring事物管理器事物涉及到数据一致性问题，较为重要保证ACID事物管理的目的使得一整个业务以原子性的方式执行。解决如下问题：public void operate() { SqlSession sqlSession = getSqlSession() ; UserMapper userMapper = sqlSession.getMapper(UserMapper.xml) ; User user = new User(6,"啦啦啦","2131

2021-05-29 01:53:21 306 1

原创 13. Spring整合Mybatis

13. Spring整合Mybatis1.导入相关依赖junitmybatismysql数据库spring相关依赖aop依赖mybatis-spring<dependencies>  <dependency> <groupId>junit</groupId>

2021-05-29 01:52:32 197

原创 12. AOP

12 . AOP什么是AOP面向切面编程，通过预编译方式和运行期动态代理实现程序功能的统一维护的一种技术。利用AOP可以对业务逻辑的各个部分进行隔离，从而使得业务逻辑各部分耦合度降低，提高程序可用性，同时提高了开发的效率横切关注点：跨越多个应用程序多个模块的方法或功能。例如日志、安全、缓存、事物等切面（ASPECT）: 被模块化的特殊对象，是一个类通知 (Advice) : 切面必须要完成的工作（切面类中的一个方法）目标（Target）：被通知的对象代理（Proxy）：

2021-05-29 01:52:03 96

原创 11.代理模式

11.代理模式静态代理角色分析抽象角色：一般使用抽象类或者接口实现，体现一个动作真实角色：被代理的角色代理角色：代理真实角色，并且能够在基础动作上进行附加操作客户：访问代理对象//抽象角色public class StaticProxy { public static void main(String[] args) { GotoSchoolHelper gotoSchoolHelper = new GotoSchoolHelper

2021-05-29 01:51:26 123 1

原创 10.使用Java方式配置Spring

10.使用Java方式配置SpringSpring的新Java配置支持中的主要工件是带 @Configuration注释的类和-带@Bean注释的方法。该@Bean注释被用于指示一个方法实例，可以配置，并初始化到由Spring IoC容器进行管理的新对象。对于那些熟悉Spring的<beans/>XML配置的人来说，@Bean注释的作用与<bean/>元素相同。您可以@Bean对任何Spring使用带注释的方法 @Component。但是，它们最常与@Configurationb

2021-05-29 01:49:28 118

原创 9. 使用注解开发

9. 使用注解开发在Spring4之后，要使用注解开发，必须导入aop依赖指定要扫描的包,这个包下的注解会自动生效<context:component-scan base-package="com.liu.pojo"></context:component-scan>常用注解@Autowired自动装配@Qualifier与**@Autowired相互配合，在复杂环境下定位唯一bean**@Nullable字段标记了这个注解，说明这个字段可以为nullp

2021-05-29 01:48:57 63

空空如也

空空如也