1.用类对象接受加上@RequestBody 直接无法访问
2.controller 无法接受到aioax.post请求
各位帮忙看下哪里有问题
package cn.itcast.container.controller;
import cn.itcast.container.pojo.Order;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.*;
@RestController
public class UserController {
@RequestMapping("/add")
public void index( @RequestBody Order order1){
Order order=new Order();
System.out.println(order1);
System.out.println("123");
}
}
下面是HTML文件
<!DOCTYPE html>
<html>
<head>
<!-- 页面meta -->
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>器具发料系统</title>
<meta name="description" content="器具管理">
<meta name="keywords" content="器具管理">
<meta content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no" name="viewport">
<!-- 引入样式 -->
<!-- 引入样式 -->
<link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
<!-- 引入组件库 -->
<script src="https://unpkg.com/element-ui/lib/index.js"></script>
<link rel="stylesheet" href="../css/style.css">
</head>
<body class="hold-transition">
<div id="app">
<div class="content-header">
<h1>单据管理<small>单据申请</small></h1>
<el-breadcrumb separator-class="el-icon-arrow-right" class="breadcrumb">
<el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
<el-breadcrumb-item>单据管理</el-breadcrumb-item>
<el-breadcrumb-item>单据申请</el-breadcrumb-item>
</el-breadcrumb>
</div>
<div class="app-container">
<div class="box">
<div class="filter-container">
<el-button type="primary" @click="save">提交订单</el-button>
<el-button type="primary" icon="el-icon-plus" size="mini" @click="add">添加</el-button>
<!-- <el-button size="mini" type="danger" @click="handleDeleteDetails()">删除</el-button>
<el-button type="danger" icon="el-icon-delete" size="mini" @click="handleDeleteAllDetails">清空</el-button> -->
</div>
<el-form class="form" :model="bindForm" ref="ruleForm">
<el-table v-loading="loading" size="small" :data="bindForm.datalist">
<el-table-column type="selection" width="55"></el-table-column>
<el-table-column label="零件号" align="center" prop="value">
<template slot-scope="scope">
<el-form-item :prop="`datalist[${scope.$index}].value`" :rules="rules.value">
<el-select
v-model="scope.row.value"
clearable
filterable
remote
reserve-keyword
placeholder="请输入关键词"
:remote-method="remoteMethod"
:loading="loading">
<el-option
v-for="item in options"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
</template>
</el-table-column>
<el-table-column label="规格" align="center" prop="description">
<template slot-scope="scope">
<el-form-item :prop=" `datalist[${scope.$index}].description`" :rules="rules.description">
<el-input v-model="scope.row.description" placeholder="请输入内容"></el-input>
</el-form-item>
</template>
</el-table-column>
<el-table-column label="数量" align="center">
<template slot-scope="scope">
<el-form-item :prop="`datalist[${scope.$index}].qty`" :rules="rules.qty">
<el-input v-model="scope.row.qty" placeholder="请输入内容"></el-input>
</el-form-item>
</template>
</el-table-column>
<el-table-column label="发货地点" align="center">
<template slot-scope="scope">
<el-form-item :prop="`datalist[${scope.$index}].workstation`" :rules="rules.workstation">
<el-input v-model="scope.row.workstation" placeholder="请输入工站"></el-input>
</el-form-item>
</template>
</el-table-column>
<el-table-column label="操作" align="center">
<template slot-scope="scope">
<!-- <el-button type="primary" size="mini" @click="handleUpdate(scope.row)">编辑</el-button> -->
<el-button size="mini" type="danger" @click="sub">删除</el-button>
</template>
</el-table-column>
</el-table>
</el-form>
</div>
</div>
</div>
</body>
<!-- 引入组件库 -->
<script src="https://unpkg.com/vue/dist/vue.js"></script>
<!-- import JavaScript -->
<script src="https://unpkg.com/element-ui/lib/index.js"></script>
<script src="https://unpkg.com/axios/dist/axios.min.js"></script>
<script>
var vue = new Vue({
el: '#app',
data() {
return {
options: [],
value: [],
list: [],
loading: false,
states: ["<0009012", "<0009016", "<0009017",
"<0009018", "<0009019", "<0009020",
"<0009024", "<0009004", "<0009005",
"<0009006", "<0001130", "<0009030", "<0009031",
"<0009033", "<0010005", "<0010006", "<0010001",
"<0010004", "<0010007", "<0010017",
"<0010018", "<0010019", "<0010020",
"<0010008", "<0010009", "<0009035",
"<0009037", "<0010010", "<0010015",
"<0010016",
],
// 支付场景数据
// 此处必须是这样的数据类型，才能够校验成功
bindForm: {
datalist: []
},
// 支付场景是否开启的状态值
rules: {
description: [{
required: true,
message: '姓名不可为空',
trigger: 'blur'
}],
qty: [{
required: true,
trigger: ['blur', 'change'],
message: '请输入正整数'
}],
workstation: [{
required: true,
trigger: ['blur', 'change'],
message: '请输入工站地址'
}],
value: [{
required: true,
trigger: ['blur', 'change'],
message: '请输入零件号'
}],
}
};
},
methods: {
/**
* 渲染表头 表头增加必填项*
* str自定义传入参数 为表头名称
*/
//添加一行
add() {
this.bindForm.datalist.push({
value: '',
description: '',
qty: '',
workstation: '',
});
},
//删除一行
sub(index) {
this.bindForm.datalist.splice(index, 1);
},
//提交表单
save() {
this.$refs.ruleForm.validate((valid) => {
if (valid) {
// 通过校验时
alert("效验通过");
console.log(this.bindForm.datalist);
axios.post("/add", this.bindForm.datalist).then((res) => {
});
} else {
alert("请确认输入的数据是否正确");
}
});
},
//零件号搜索
remoteMethod(query) {
if (query !== '') {
this.loading = true;
setTimeout(() => {
this.loading = false;
this.options = this.list.filter(item => {
return item.label.toLowerCase()
.indexOf(query.toLowerCase()) > -1;
});
}, 200);
} else {
this.options = [];
}
}
},
mounted() {
//初始化create 一行
this.bindForm.datalist.push({
value: '',
description: '',
qty: '',
workstation: ''
});
//初始化
this.list = this.states.map(item => {
return {
value: `${item}`,
label: `${item}`
};
});
}
})
</script>
</html>
