<script> import Axios from 'axios'; export default { data() { return { form: { stuno: '', stuname: '', stuage: '', }, tableData:[], studentMessage:null, } }, methods: { onSubmit() { this.$message('添加成功!') }, onCancel() { this.$message({ message: '取消!', type: 'warning' }) }, //实现添加 addStudent(){ //后端更新 var url = http://localhost:8080/javaWebMaven_war_exploded/addStudent.action?stuno=${this.form.stuno}&stuname=${this.form.stuname}&stuage=${this.form.stuage}; Axios.get(url).then(response=>{ //前端更新 this.$set(this.tableData, this.studentMessage, this.form); }).catch(error=>{ console.log("添加失败了："+error) }); } } } </script>补全添加学生

你的代码中缺少一些关键的部分，我来补充一下：

<template>
  <div>
    <el-form ref="form" :model="form" label-width="80px">
      <el-form-item label="学号" prop="stuno">
        <el-input v-model="form.stuno"></el-input>
      </el-form-item>
      <el-form-item label="姓名" prop="stuname">
        <el-input v-model="form.stuname"></el-input>
      </el-form-item>
      <el-form-item label="年龄" prop="stuage">
        <el-input v-model="form.stuage"></el-input>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" @click="addStudent">添加学生</el-button>
        <el-button @click="onCancel">取消</el-button>
      </el-form-item>
    </el-form>

    <el-table :data="tableData">
      <el-table-column prop="stuno" label="学号"></el-table-column>
      <el-table-column prop="stuname" label="姓名"></el-table-column>
      <el-table-column prop="stuage" label="年龄"></el-table-column>
    </el-table>
  </div>
</template>

<script>
import Axios from 'axios'

export default {
  data() {
    return {
      form: {
        stuno: '',
        stuname: '',
        stuage: '',
      },
      tableData: [],
    }
  },
  methods: {
    onSubmit() {
      this.$message('添加成功!')
    },
    onCancel() {
      this.$message({ message: '取消!', type: 'warning' })
    },
    addStudent() {
      // 后端更新
      var url = "http://localhost:8080/javaWebMaven_war_exploded/addStudent.action?stuno=" + this.form.stuno + "&stuname=" + this.form.stuname + "&stuage=" + this.form.stuage;
      Axios.get(url).then(response => {
        // 前端更新
        this.tableData.push({
          stuno: this.form.stuno,
          stuname: this.form.stuname,
          stuage: this.form.stuage,
        })
        this.$message('添加成功!')
      }).catch(error => {
        console.log("添加失败了：" + error)
        this.$message.error('添加失败!')
      });
    }
  }
}
</script>

这里我假设你使用了 Element UI 的表单和表格组件，然后在添加学生的方法中，我使用 Axios 库发送 GET 请求到后端，然后在成功回调中更新前端的数据，并弹出一个成功提示框，如果请求失败则弹出一个错误提示框。你需要根据你的实际情况进行修改。