springboot-vue 项目

一 、后端

 @Controller一般  在controller中return返回的是一个地址@RestController 返回的是一个数据(json)，在前后端分离都是用@RestController

 @RequestParam     与浏览器上的值作为绑定(如果name写错，也能传递)，不过写了之后一定要传

 @RequestBody  传递json格式数据时用

 静态资源路径： 一般用 spring.mvc.static-path-pattern=/image/**

 文件上传

 Springboot  restful 风格 ： @Ge't'Mapping查询   post 添加  put 更新  delete 删除 

 传统的(上) 与restful(下) 对比

 

mybatis-plus  @Tablename用于对应实体类名  而@TableField时对应属性的名 (为了防止名写错而出的)

 其中里面的 QueryWrapper用于写出条件  给mybatis-plus里面 查询selectList，做出条件

 

二 前端vue

  属性绑定  v-bind 可以写为 ：  v-bind = ：  单项绑定

 事件绑定 v-on：click = @click   可以定义表达式 和 方法 

 条件渲染  v-show  和v-if  差不多的

 列表渲染  v-for   循环语句 

其中在v-for 循环中指定唯一索引  v-bind key  一般唯一索引会直接给的自身主键id 例  user.id

　　

 v-model 双向绑定  与 v-bind区别  v-model当页面发送变化时 绑定的值也会发送变化 ，但v-bind不会发生变化

相同点 ，当绑定的值发生变化 页面会发生变化

Vue组件 ： 构成

1、  Vue组件导入   ./ 为相对路径  这里就是Hello.vue文件下的路径

 2、通过组件传值  在app.vue内   注意这里的data数据需要在 组件template下对应的类定义 v-bind绑定

 在创建的Movie.vue内  通过props来取外界传递的值  props是自定义属性 里面放的是属性

注意这里通过v-on 事件绑定 methods是写在data后面 

 3、element-ui

使用第三方组件   vue2.0 是element-ui   vue3.0是element-plus

第三方组件需要全局注入： 一下为vue2.0的注册   vue3.0会不同

 

4、axios

get post请求

 利用axios 拿到后端的数据

 在接口上加入 @CrossOrigin 允许跨域

 最后把值传递页面

 这里需要用箭头函数 作用域更强    一般用箭头函数

 

5、vue router

router-link  相当于超链接 <a>

1、声明路由

 在js中 .一个点表示当前目录  ..两个点表示当前目录的上一级

2、在js中进行跳转 首先导入import 路径 再在router中添加路径 以及跳转到的目录

 这里是  /discover/playlist 会跳转到 playlist 目录下

3. :id 为所有的数  访问/my/所有的内容  都会到目录product

 $route.params.id 可以获取这个id

 

 6.vuex