[JavaScript知识库]Spring boot + VUE 前后端分离 理解概述 和实现

（我不是教学，我是自己学自己记）
前段 VUE html 通过 -> AJAS 请求 请求后端 -> 后端提供restFul 后端数据接口
restFul接口规范入口

下面开始 Springboot + vue 开始开发

创建vue项目 、vue vuecli创建项目
前端先早假数据进行测试

index.js  引入这个页面
import Book from ‘../views/Book.vue’
然后在配置映射
{
	path:'/boot',
	component:Book
}

vue 要装axios
通过命令
vue add axios

在views 里创建一个新的vue 页面
vue页面只能有一个根节点
<template>
	<dev>
		<table>
			<tr v-for = "itme in books">
				<td>{{itme.id}}<td>
			<tr>
		<table>
	</dev>
</template>
<script>
	export defaulf{
		name:"Book"，
		data(){
			return{
				msg:'hello',
				books:[{id:1},{id:2}]
			}
		}
		created(){
		//then 是回调函数  两个服务调用会有跨域问题
		//后端解决 implements WebMvcConfigurer  重写方法 addCorsMappings
		const _this = this;
			axios.get(url).then(function(resp){
				console.log(resp)
				_this.books = resp.data
			})
		}
	}
</script>
<style></style>

后端查询数据接口自己写，自己提供，就返回id就好了
下面是方便开发的配置
创建后台spring boot 项目 导入spring jpa
@Entity 动态绑定 数据库表

配置 show-jpa： true  sql显示
			properties： 
				hibernate：
					format_sql: true  格式化

创建 book 的 repository 接口

 extends JpaRepository<Book,Integer>  //实体类的类型，主键的类型