黑马2023JAVAweb|Ajax,Axios2

已于 2024-07-17 11:09:55 修改
阅读量778 收藏 18
点赞数 11
分类专栏： Javaweb（SpringBoot） 文章标签： ajax 前端 javascript
于 2023-12-06 22:08:22 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/leeyayai_xixihah/article/details/134815664
版权

目录

​编辑

一：Ajax介绍--从url服务端加载数据

(一)Ajax

1.Ajax概述

2.同步与异步交互

3.原生Ajax（繁琐）

（二）Axios3

2.案例

2.推荐使用的简化Axios代码

3.案例

二：前后端分离开发

（一）前后端开发介绍

（二）YAPI（接口文档的管理平台）  

三：前端工程化

（一）环境准备--安装NodeJS--Vue-ci

https://www.bilibili.com/video/BV1m84y1w7Tb?p=37&spm_id_from=pageDriver&vd_source=883ba25d74f359cc50daee8d9d826cc4

（二）vue项目

1.vue项目创建

​编辑

2.vue项目目录

3.vue项目启动

（三）vue项目开发流程​编辑

1.vue组件

2.举例

四：Vue组件库Element

（一）. 组件：自定义标签

（二）Element组件库

1.Element快速入门

​编辑

2.常见组件

3.案例

五：Vue路由

1.前端路由

2.vue router

3.案例

六：打包部署

1.打包

2.部署

a332f5a9b24a483a8d4182db177a2cf3.png

一：Ajax介绍--从url服务端加载数据

（Vue渲染数据，最开始数据是固定不可变的(html文件中敲得)）--->DOM文档对象模型，其通过标签获取元素（文本，图片，视频），再更改数据，但这个过程还是在html文件中进行的--->Vue，可以在网页端操作数据--->Ajax从url服务端获取数据。拿到数据后，后面对数据进行处理就又回到DOM，CSS等基本操作）

(一)Ajax

Ajax：异步的JS和XML

作用：（1）数据交换

（2）异步交互

1.Ajax概述

82f0e5f898ed457d92a1f5a5e2f0fee4.png

5c66dd73e1ff4baa9b56cad86a48379a.png

2.同步与异步交互

同步：所有数据都加载完，才可以操作

fa5ae1c7da4c4acb8d2bcf7b5d6758ea.png

3.原生Ajax（繁琐）

发送+响应

811d9b13045d4c1dbed8c8239d60f7ee.png

（二）Axios3

1. Axios：简化Ajax，便于使用---还是不推荐使用，代码依旧复杂

12a582bad274427ba59558d9630338f6.png

对比原生Ajax，Aios代码简介很多，其将创建对象+发送请求+接收响应封装在一段代码里

f49a09ad2ce8413a8fe10ac5eb39a10c.png

2.案例

<body>
    <input type="button" value="读取数据GET"  onclick="get()">
    <input type="button" value="读取数据POST"  onclick="post()">
</body>
<script>
    function get(){
        //通过axios发送异步请求--get
        axios({
            method:"get" ,
            url:"http://yapi.smart-xwork.cn/mock/169327/emp/list"//服务器端url
        }).then(result =>{
            console.log(result.data);
        })
    }
    function post(){
        //通过axios发送异步请求--post
        axios({
            method:"post" ,
            url:"http://yapi.smart-xwork.cn/mock/169327/emp/deleteById",  //服务器端url
            data:"id=1"
        }).then(result =>{
            console.log(result.data);
        })
    }
</script>

请求失败是网站打不开。

538e0e91ecfb4a778226c2c3c9b9d70d.png

2.推荐使用的简化Axios代码

a58fdf006e95482ba49c3aeb8751fb12.png

3.案例

第2步回到之前的Vue操作，v-for,v-if

主要是第一步如何从服务端（url）获取数据，并将其赋值给vue对象里的data

f7c14654874b47518293468d13c5272f.png

重点代码

26420ed054114ca3925acfc37a787487.png

2294175f863745b6b59898451804d82d.png

ce4d3023049548d087459158e1946bb5.png

二：前后端分离开发

（一）前后端开发介绍

前后端通过接口文档各自实现功能

c3b9395c45344bf6a2237779ce06dffc.png

接口文档示例

03de2c543fd44b93b74b29cae145108e.png

（二）YAPI（接口文档的管理平台）  

API接口管理工作--管理API文档

Mock服务--自动生成模拟测试数据

a4738eb9702145a4937172768a20887e.png

三：前端工程化

889e493b9d9742b8911278a55b581fc0.png

（一）环境准备--安装NodeJS--Vue-ci

95f5ba6ba7d7411ca57078eb6f716733.png

https://www.bilibili.com/video/BV1m84y1w7Tb?p=37&spm_id_from=pageDriver&vd_source=883ba25d74f359cc50daee8d9d826cc4

（二）vue项目

1.vue项目创建

4c4fb9d96ce74029890d54955ad782fd.png

d8757b725ada4da3aaac534eccf2ce00.png

8a88c2d68e054ccaa08c48624c8761e1.png

482e4b8023db46618b14e672c7c543c2.png

53f0b49be0dc4a78afdc8eed67309d49.png

Day03-06. 前端工程化-Vue项目开发流程_哔哩哔哩_bilibili

6ab21ed1d6aa4973bbcd081300e4e060.png

d201e42f3d0c4bdc84eca4e8bf17753c.png

2.vue项目目录

f2a16c84b1b44b32861aa3b577f13403.png

3.vue项目启动

78ca6d71e12b49a6a9f2438b09f42397.png

ctrl+shift+p搜索npm可调出如下NPM脚本，然后选第一个打开图形化界面

c9515147cae6403e82e90822fa65cdc9.png

9c549bedc10a4761aa7cef6c94d95e5a.png

0f0b7b690e7c49df86d42ed8cf4adcf6.png

4.vue项目-配置端口

如何修改8080的端口号，要修改这个端口号，因为后面学的Java某个东西默认用这个端口号，所以这边要改掉

d52ff4d8ac254e17865b1becfee73169.png

a6213960d888455788e39e5df7332b4e.png

端口号改成了7000

（三）vue项目开发流程
e82ddd2ac2c844bda73fc6ef8a3e4828.png

1.vue组件

组件：自定义标签

a49f6caeedb9433a9f9b7567e1158cb8.png

在Vue项目的开发中，其实main.js以及index.html很少会去操作，主要修改的都是.vue文件(创建组件插件)

2.举例

6710b842337c48b8af4653d7bb9fa6cf.png

四：Vue组件库Element

（一）. 组件：自定义标签

e5e7bdf9edf941f0bdc34024e5c6923c.png

（二）Element组件库

1.Element快速入门

在当前项目中安装Element库

ac7ca373c8c24188b14ebf0eb466c12d.png

a5271f698fcc41bf883ea834f0b8bc11.png

（1）安装

终端输入：npm i element-ui -S

（2）引入element-ui组件库

在 main.js 中写入以下内容：

import Vue from 'vue';
import ElementUI from 'element-ui';
import 'element-ui/lib/theme-chalk/index.css';
import App from './App.vue';

Vue.use(ElementUI);

new Vue({
  el: '#app',
  render: h => h(App)
});

（3）访问官网，复制代码并调整

注意：快捷键ctrl+alt+l格式化

网页展示的是app.vue的内容，如果需要展示ElementView的内容，需要，将其引入到app.vue中（调整）

ae6709c354ae491bbe63c2ee7bd876d0.png

ElementView

<template>
    <div>
        <!-- button按钮 -->
        <el-row>
      <el-button>默认按钮</el-button>
      <el-button type="primary">主要按钮</el-button>
      <el-button type="success">成功按钮</el-button>
      <el-button type="info">信息按钮</el-button>
      <el-button type="warning">警告按钮</el-button>
      <el-button type="danger">危险按钮</el-button>
    </el-row> 
    </div>
</template>

<script>
export default {
    
}
</script>

<style>

</style>

App.vue

<template>
  <div id="app">
    <h1>{{message}}</h1>
    <element-view>

    </element-view>
  </div>
</template>

<script>
import ElementView from './views/element/ElementView.vue'

export default {
  components:{ElementView},
  data(){
    return {
      message:"hello world"
    }
  }
}
</script>
<style>

</style>

2.常见组件

1.Tabel表格

组件 | Element

粘贴代码，调整

2.Pagination 分页

组件 | Element

（1）属性

d1a52d9d50fe43768195f20c2d28d4d2.png

（2）事件

c66a1abcf8ee4656b186a512bc74d1ba.png

 methods: {
        handleSizeChange:function(ver){ //pageSize 改变时会触发
            alert("每页条数"+ver)
        },
        handleCurrentChange:function(ver){ //currentPage 改变时会触发
            alert("当前页数"+ver)
        }

      },
<el-pagination
  background
  @size-change="handleSizeChange" 
      @current-change="handleCurrentChange"
  layout="sizes,prev, pager, next,jumper,total"
  :total="1000">
</el-pagination>

3.Dialog 对话框，表单

43a7326d32754cc7a0ac8fe9d3a18563.png

<template>
    <div>
        <!-- button按钮 -->
        <el-row>
      <el-button>默认按钮</el-button>
      <el-button type="primary">主要按钮</el-button>
      <el-button type="success">成功按钮</el-button>
      <el-button type="info">信息按钮</el-button>
      <el-button type="warning">警告按钮</el-button>
      <el-button type="danger">危险按钮</el-button>
    </el-row> 

    <!-- 表格 -->
    <el-table :data="tableData" style="width: 100%">
    <el-table-column prop="date" label="日期" width="180">  </el-table-column>
    <el-table-column prop="name"  label="姓名" width="180"> </el-table-column>
    <el-table-column  prop="address"  label="地址"> </el-table-column>
    </el-table>

    <!-- 分页 -->
    <el-pagination
  background
  @size-change="handleSizeChange" 
      @current-change="handleCurrentChange"
  layout="sizes,prev, pager, next,jumper,total"
  :total="1000">
</el-pagination>

<br><br>

<!-- 打开嵌套表格的 Dialog -->
<el-button type="text" @click="dialogTableVisible = true">打开嵌套表格的 Dialog</el-button>

<el-dialog title="收货地址" :visible.sync="dialogTableVisible">
  <el-table :data="gridData">
    <el-table-column property="date" label="日期" width="150"></el-table-column>
    <el-table-column property="name" label="姓名" width="200"></el-table-column>
    <el-table-column property="address" label="地址"></el-table-column>
  </el-table>
</el-dialog>

<!-- 打开嵌套表单的 Dialog -->
<el-button type="text" @click="dialogFormVisible = true">打开嵌套表格的 Dialog</el-button>
<el-dialog title="Form表单" :visible.sync="dialogFormVisible">
    <el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="100px" class="demo-ruleForm">
  <el-form-item label="活动名称" prop="name">
    <el-input v-model="ruleForm.name"></el-input>
  </el-form-item>
  <el-form-item label="活动区域" prop="region">
    <el-select v-model="ruleForm.region" placeholder="请选择活动区域">
      <el-option label="区域一" value="shanghai"></el-option>
      <el-option label="区域二" value="beijing"></el-option>
    </el-select>
  </el-form-item>
  <el-form-item label="活动时间" required>
    <el-col :span="11">
      <el-form-item prop="date1">
        <el-date-picker type="date" placeholder="选择日期" v-model="ruleForm.date1" style="width: 100%;"></el-date-picker>
      </el-form-item>
    </el-col>
    <el-col class="line" :span="2">-</el-col>
    <el-col :span="11">
      <el-form-item prop="date2">
        <el-time-picker placeholder="选择时间" v-model="ruleForm.date2" style="width: 100%;"></el-time-picker>
      </el-form-item>
    </el-col>
  </el-form-item>
 
  <el-form-item>
    <el-button type="primary" @click="submitForm('ruleForm')">提交</el-button>
    <el-button @click="resetForm('ruleForm')">重置</el-button>
  </el-form-item>
</el-form>
</el-dialog>

    </div>
</template>

<script>
export default {
      data() {
        return {
            //表单对话框
            ruleForm: {
          name: '',
          region: '',
          date1: '',
          date2: '',
        },

        dialogFormVisible: false,
            //表格对话框
            gridData: [{
          date: '2016-05-02',
          name: '王小虎',
          address: '上海市普陀区金沙江路 1518 弄'
        }, {
          date: '2016-05-04',
          name: '王小虎',
          address: '上海市普陀区金沙江路 1518 弄'
        }, {
          date: '2016-05-01',
          name: '王小虎',
          address: '上海市普陀区金沙江路 1518 弄'
        }, {
          date: '2016-05-03',
          name: '王小虎',
          address: '上海市普陀区金沙江路 1518 弄'
        }],
        dialogTableVisible: false, //通过这个值显示或隐藏表格，为true显示

          tableData: [{
            date: '2016-05-02',
            name: '王小虎',
            address: '上海市普陀区金沙江路 1518 弄'
          }, {
            date: '2016-05-04',
            name: '王小虎',
            address: '上海市普陀区金沙江路 1517 弄'
          }, {
            date: '2016-05-01',
            name: '王小虎',
            address: '上海市普陀区金沙江路 1519 弄'
          }, {
            date: '2016-05-03',
            name: '王小虎',
            address: '上海市普陀区金沙江路 1516 弄'
          }]
        }
      },
      methods: {
        //表单提交重置的方法
        submitForm(formName) {
        this.$refs[formName].validate((valid) => {
          if (valid) {
            alert(JSON.stringify(this.ruleForm));
          } else {
            console.log('error submit!!');
            return false;
          }
        });
      },
      resetForm(formName) {
        this.$refs[formName].resetFields();
      },

      //换页方法
        handleSizeChange:function(ver){ //pageSize 改变时会触发
            alert("每页条数"+ver)
        },
        handleCurrentChange:function(ver){ //currentPage 改变时会触发
            alert("当前页数"+ver)
        }

      },
    }
</script>

<style>

</style>

3.案例

d897d285cbc84a5bba3cb78571c963aa.png

（1）基本页面布局

cbabb31d50274f4a89d3eb1f1c17a437.png

（2）页面组件实现

bf272107e0e34830ae6d7499cd01a95a.png

（3）axios异步加载数据

<template>
    <div>
   <el-container>
  <el-header>tlias智能学习辅助系统</el-header>
   <el-container>

    <el-aside width="200px" style="background-color: rgb(238, 241, 246)">
        <el-menu :default-openeds="['1', '3']">
      <el-submenu index="1">
        <template slot="title"><i class="el-icon-message"></i>系统信息管理</template>    
          <el-menu-item index="1-1">部门管理</el-menu-item>
          <el-menu-item index="1-2">员工管理</el-menu-item>
        </el-submenu>
    </el-menu>
    </el-aside>

    <el-main>
        <!-- 表单 -->
        <el-form :inline="true" :model="searchForm" class="demo-form-inline">
            <el-form-item label="姓名">
            <el-input v-model="searchForm.name" placeholder="姓名"></el-input>
            </el-form-item>
            <el-form-item label="性别">
            <el-select v-model="searchForm.gender" placeholder="性别">
              <el-option label="男" value="1"></el-option>
              <el-option label="女" value="2"></el-option>
            </el-select>
          </el-form-item>
          <!-- 日期选择器 -->
          <el-form-item label="入职日期">
            <el-date-picker
                  v-model="value1"
                  type="datetimerange"
                    range-separator="至"
                  start-placeholder="开始日期"
                   end-placeholder="结束日期">
    </el-date-picker>
            </el-form-item>
          <el-form-item>
            <el-button type="primary" @click="onSubmit">查询</el-button>
          </el-form-item>
        </el-form>

        <!-- 表格 -->
        <el-table :data="tableData" border>
        <el-table-column prop="name" label="姓名" width="180"></el-table-column>
        <el-table-column prop="image" label="图像" width="180"></el-table-column>
        <el-table-column prop="gender" label="性别" width="140"></el-table-column>
        <el-table-column prop="job" label="职位" width="140"></el-table-column>
        <el-table-column prop="entrydate" label="入职日期" width="180"></el-table-column>
        <el-table-column prop="updatetime" label="最后操作时间" width="230"></el-table-column>
        <el-table-column label="操作" >
        <el-button type="primary" size="mini">编辑</el-button>
        <el-button type="danger" size="mini">删除</el-button>
        </el-table-column>
    </el-table>
        <!-- 分页 -->
        <br>
        <!-- 分页 -->
    <el-pagination
  background
  layout="sizes,prev, pager, next,jumper,total"
  :total="100">
</el-pagination>


    </el-main>
  </el-container>
</el-container>  
    </div>
</template>

<script>
export default {
    data() {
      return {
        searchForm: {
          name: '',
          gender: ''
        }
      }
    },
    methods: {
      onSubmit() {
        console.log('submit!');
      }
    }
  }
</script>

<style>
.el-header {
    background-color: #B3C0D1;
    color: #333;
    text-align: center;
    line-height: 60px;
  }
  .el-aside {
    background-color: #D3DCE6;
    color: #333;
    text-align: center;
    line-height: 600px;
  }
  
</style>

五：Vue路由

1.前端路由

3cc2e6634e10405ba3eb921fe55aa2b1.png

2.vue router

112227de95a04ef1aeb029b8727789da.png

流程：

ec3146b56ba342bbabd82dfbeb472849.png

3.案例

a1a6cb54fe5c4fdabd784b5fc00b40b8.png

311f7057b4084820b19a5f5bf834ac26.png

4438c79a91cb47cfad188ea81b2e09e2.png

139662a0e6494d689b1a094f38a940ef.png

e82d3ce51dd34b74bacebb9beecdf99d.png

六：打包部署

1.打包

e1773a0714f24e69b418a031129f06b9.png

2.部署

c9f897d439314b289912bad5e36546f2.png

e1f36ff23a4143dbb8c252e241ea1039.png部署好后，浏览器访问：

edf565b09ca749cd9309a793c9b455eb.png

d10490dafd59418394dfeefeb8437ce6.png

leeyayai_xixihah
关注
  • 11
    点赞
  • 踩
  • 18
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
专栏目录
黑马AJAX
weixin_44736473的博客
12-24 224
黑马ajax个人纪录
【前端学习之路】Ajax 基本概念 （黑马课程笔记）
a123456_9的博客
08-19 486
二者的区别在于，get值会将提交的数据显示在地址栏， 而post不会。post 方式适合用来提交大量的、复杂的、或包含文件上传的数据。，在涉及文件上传的操作时，必须将 enctype 的值设置为 multipart/form-data。action 属性的值应该是后端提供的一个URL地址，若未指定，则默认提交地址为当前页面。把表单提交到 action URL，有两个可选值，get 和 post，默认值为get。使用Ajax 请求数据时，被请求的URL地址，就叫做数据接口（简称接口）。
ajax json
hqc_xds的博客
11-26 322
## 今日内容     1. AJAX：     2. JSON     # AJAX：     1. 概念： ASynchronous JavaScript And XML    异步的JavaScript 和 XML         1. 异步和同步：客户端和服务器端相互通信的基础上             * 客户端必须等待服务器端的响应。在等待的期间客户端不能做其他操作。      ...
黑马AJAX part1 （未完）
hlonelier的博客
05-24 95
c. 服务器把找到的资源，响应（发送）给客户端。网页中的对象，xhr封装，jq相关的ajax函数，通过ajax向服务器发送get数据请求，服务器处理请求，再响应get请求。浏览器只有通过URL地址，才能正确定位资源的存放位置，从而成功访问正确的资源。（向服务器要资源）：根据URl地址，向服务器获取HTML，css，js，图片文件，数据资源等。（往服务器发送数据）：向服务器提交登录信息，注册信息，添加用户提交用户信息等数据提交操作。ajax向服务器发起post数据请求，服务器处理请求，再响应post请求。
《前端》Ajax（1）（黑马ajax两天课程）
BelleDiao的博客
02-04 453
1、概述 在此之前，我们可以通过以下几种方式让浏览器发出对服务端的请求，获得服务端的数据： 地址栏输入地址，回车，刷新 特定元素的 href 或 src 属性 表单提交 这些方案都是我们无法通过或者很难通过代码的方式进行编程（对服务端发出请求并且接受服务端返回的响应）， 如果我们可以通过 JavaScript 直接发送网络请求，那么 Web 的可能就会更多，随之能够...
教材源码_javaweb_黑马程序员Javaweb源码_
09-30
黑马程序员是一家知名的IT教育机构，他们提供的Javaweb教材源码是为了帮助学员深入理解和实践Web开发技术。下面将详细介绍JavaWeb的基本概念、核心技术和黑马程序员源码在学习过程中的作用。 1. **JavaWeb基础** ...
13_JavaWeb——AJAX配套资源
05-02
此资源与我的博客13_JavaWeb——AJAX中的两个案例对应，其中Demo5使用AJAX异步处理页面实现对用户输入的实时校验，Demo6使用Axios+JSON完成对品牌列表的展示和添加，取代了先前的JSP。希望有所帮助
Ajax JavaWeb JS 三级联动
05-07
在Web开发中，"Ajax JavaWeb JS 三级联动"是一个常见的功能需求，它涉及到前端JavaScript技术、后端JavaWeb服务以及Ajax异步通信。这个功能主要用于创建交互性强的下拉菜单，通常用于地区选择、商品分类等场景，用户...
Java资源/java学习练习项目 javaWeb+Axios+ajax+Mybatis+vue
06-21
JavaWeb 介绍 javaWeb+Axios+ajax+Mybatis+vue 软件架构 软件架构说明 登录,注册没有写，也不需要写吧。 基于element-ui+javaweb+mybatis使用 代码简洁明了，更新操作有些许瑕疵，但不影响使用。
基于javaweb和ajax的省市联动实现
12-16
在JavaWeb开发中，"基于Ajax的省市联动实现"是一个常见的功能需求，它允许用户在选择省份时，市的选择项会动态更新，提供相应的下拉选项。这种联动效果提升了用户体验，减少了不必要的页面刷新。实现这一功能的核心...
b站黑马JavaScript的Ajax案例代码——图书管理案例
weixin_72322475的博客
11-25 1726
b站黑马JavaScript的Ajax案例代码——图书管理案例
JavaWeb开发 —— Ajax
hdakj22的博客
04-12 1762
Ajax介绍、原生Ajax、Axios以及综合案例分析练习
JavaWeb开发-03-Ajax-Vue-Element
wangjh11234的博客
05-27 386
JavaWeb开发-03-Ajax-Vue-Element
【JavaWeb】Vue-Element
qinjilll的博客
04-05 438
Vue的组件文件以 .vue结尾，每个组件由三个部分组成：、、。YApi是高效、易用、功能强大的api管理平台，旨在为开发、产品、测试人员提供更优雅的接口管理服务。是饿了么团队研发的，一套为开发者、设计师和产品经理准备的基于Vue 2.0的桌面端组件库。vue-cli 是vue官方提供的一个脚手架，用于快速生成一个vue的项目模板。组成网页的部件，例如超链接、按钮、图片、表格、表单、分页条等等。的技术，如：搜素联想、用户名是否可 用的校验等等。
Javaweb之Axios的详细解析
最新发布
qq_69748833的博客
11-22 1732
前端首先是一张表格，我们缺少数据，而提供数据的地址已经有了，所以意味这我们需要使用Ajax请求获取后台的数据。但是Ajax请求什么时候发送呢？页面的数据应该是页面加载完成，自动发送请求，展示数据，所以我们需要借助vue的mounted钩子函数。ajax请求的数据我们应该绑定给vue的data属性，之后才能进行数据绑定到视图；首先创建文件，提前准备基础代码，包括表格以及vue.js和axios.js文件的引入。首先创建文件，提前准备基础代码，包括表格以及vue.js和axios.js文件的引入。
Axios异步请求
weixin_46597615的博客
04-13 360
Axios异步请求
黑马JAVAWeb Day3
CaiZijian2002的博客
10-25 627
P34 Ajax介绍。
vue中通过axios发送请求接收对象，并用变量接收对象中的数据
qq_60390518的博客
06-10 1032
相当于json对象.data；然后要想在vue对象中接收这个数组，首先在vue的data中设置相应的变量，注意：变量类型要对应上否则没法接收。其中result.data接收到的是一个json对象，这里是想得到json对象中的名为data的数组，所以用的是。其接收的json对象如下。
JavaWeb2023_03_Vue-Element
qq_52922453的博客
05-25 309
前后台混合开发和前后台分离开发。前后台混合开发，顾名思义就是前台后台代码混在一起开发，如下图所示：这种开发模式有如下缺点：沟通成本高：后台人员发现前端有问题，需要找前端人员修改，前端修改成功，再交给后台人员使用分工不明确：后台开发人员需要开发后台代码，也需要开发部分前端代码。很难培养专业人才不便管理：所有的代码都在一个工程中不便维护和扩展：前端代码更新，和后台无关，但是需要整个工程包括后台一起重新打包部署。
黑马2023javaweb
03-26
很高兴听到您对黑马2023 Java Web的兴趣。黑马2023 Java Web是一门涵盖Java Web技术栈的课程，主要包括Java EE基础、Spring框架、Mybatis框架、SpringBoot框架、Web前端技术等内容，旨在帮助学员掌握Java Web应用...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 2
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值