Vue+SpringBoot+Mybatis+Mysql前后端分离案例

最新推荐文章于 2024-07-30 13:51:05 发布

mark_bin

最新推荐文章于 2024-07-30 13:51:05 发布

阅读量3.6k

点赞数 2

文章标签： vue spring boot mysql mybatis

本文链接：https://blog.csdn.net/mark_bin/article/details/104258412

版权

本文介绍了使用Vue、Spring Boot、Mybatis和Mysql构建前后端分离应用的案例。主要展示了在App.vue文件中添加增删改查操作的代码，以及通过前端交互实现数据库数据的修改，包括添加、获取所有员工信息、删除和更新用户信息的过程。

摘要由CSDN通过智能技术生成

Vue+SpringBoot+Mybatis+Mysql前后端分离案例(二)

前端开发

main.js代码如下

import Vue from 'vue'
import App from './App'
import router from './router'
import axios from 'axios'
Vue.prototype.$http= axios
Vue.config.productionTip = false

new Vue({
  el: '#app',
  router,
  components: {App},
  template: '<App/>'
})

App.vue代码

App.vue代码中添加了4个按钮用于增删改查的请求，数据信息均打印在控制台窗口，用户信息就不展示在界面上了。。

<template>
  <div id="app">
    <button id="btnAdd" @click="addUser">添加用户信息</button>
    <button id="btnDelete" @click="deleteUser">删除用户信息</button>
    <button id="btnUpdate" @click="updateUser">更改用户信息</button>
    <button id="btnGe