DAY18 spring AOC Ajax vue路由

• Spring Aop

概述：是面向切面的编程，扩展了面向对象的不足  

切面 Aspect :其实就是一个类，要用@Aspect注解

通知advice：就是类里的方法，分为前置通知， 后置通知，环绕通知，返回后通知，异常通知。

• 使用步骤

1. 先加入jar包。Spring-boot-start-aop
2. 创建切面

切面表达式：通过excution属性声明

@poincut（“  excution(* cn.tedu.controller.*.*(..))  ”）

创建一个方法：

Public void pointcut(){}----这是一个固定的格式

1. 前置通知：@before（“poincut（）”）

使用场景：权限 缓存 开启事物 日志

在调用你的目标方法前，就要执行

1. 后置通知：@After(“poincut（）”）

在调用你的目标方法后，就要执行。

使用场景：结束事物，日志，释放资源

1. 环绕通知：around(“poincut()”)

在调用你的目标方法之前和之后，都要执行

Aop思想的好处，让程序员更加关注业务本身，把通用代码形成切面

• ajax改造前端代码

使用axios语法发起请求

步骤:

（1）先从script里面导入js文件

导入js/vue.js文件，再导入js/axios main.js

注意他们的先后顺序。

1. 准备数据渲染区 div标签
2. 创建vue()对象，使用axios访问后端服务器，

Axios.get(“填访问后端的路径”).then(

a=>{console.log(a.data)}

 a是服务器的返回值交给a变量保存，箭头函数

Data属性用来获取数据，a.data就是获取a的数据

要想用axios访问服务器，还需要在controller那里添加一个注解，@crossorigin  表明放行js的访问请求

• vue路由

1. 先导入JS文件，注意顺序

Js/vue.js

Js/vue-router.js

2准备数据渲染区

Div

使用路由 router-link被HTML翻译成a标签， to属性被翻译成href属性

展示路由的效果

<router-view></router-view>

2.

定义组件

Var  变量名1 = {template:”<h1>展示的内容</h1>”}

Var 变量名2 = {template：”<h1>展示的内容</h1>”}

创建路由实例

Var luyou = new vuerouter({

Routes:[

{path:”/路径1 ”， component变量名1}，

{path：”/路径2”,  componet:变量名2}

]

})

创建对象

New Vue（{

el：“#app”，

Router：luyou    通过router属性配置路由

}）