添加数据，添加成功，但是返回数据为空

Question

效果图:

vue代码

<template>
  <div align="center">
    <el-form :model="banner" status-icon ref="ruleForm" style="width: 20%" label-width="100px" class="demo-ruleForm">
      <el-form-item label="学生名称" prop="Student_Name">
        <el-input v-model.number="formLabelAlign.Student_Name"></el-input>
      </el-form-item>

      <el-form-item label="学生年龄" prop="Student_Age">
        <el-input v-model.number="formLabelAlign.Student_Age"></el-input>
      </el-form-item>

      <el-form-item>
        <el-button type="primary" @click="add">添加</el-button>
        <el-button>取消</el-button>
      </el-form-item>
    </el-form>

  </div>

</template>

<script>
export default {
  data () {
    return {
      /* formLabelAlign:[] */
      formLabelAlign: {
        Student_Name: '',
        Student_Age: ''
      }
    }
  },
  methods: {
    add () {
      this.$http.post('/api/StudentController/insert', this.formLabelAlign).then(res => {
        console.log('res.data==============>', res.data)
        if (res.status === 200) {
          this.$router.push({
            path: '/'
          })
        }
      })
    }
  },
  created () {

  }
}
</script>

<style scoped>

</style>

Answer 1

你可以写一个查询的方法，每次新增一条数据，重新查询一下列表，然后表格的prop就是你查询列表对应的字段