1.最近在学vue,刚接触到vue这块,本文主要介绍从vue像后台传值的问题
使用vue-resource发送请求时,在params中传一个对象,后台实体类接受,但总是失败,后台得到的值是空,错误代码如下:`
前端代码
new Vue({
el:"#app",
data: {
book:{
id:'',
author:'',
name1:'',
price:''
},
books: []
},
created:function(){//在创建实例之后调用
let that = this;
axios.post('demoController/show.do'
)
.then(function (res) {
that.changeBooks(res.data);
})
.catch(function (error) {
console.log(error);
})
},
methods:{
add:function(){
this.books.push(this.book);
//console.log(JSON.stringify(this.book));
this.$http.post('demoController/add.do',
{
bookBean:this.book
},
{emulateJSON:true})
.then(function(res){
console.log(res);
},function(){
console.log('请求失败处理');
})
this.book={id:'', author:'', name1:'', price:''};
},`
后台部分:`
@ResponseBody
@RequestMapping("/add.do")
public String add(BookBean bookBean){
int result = bookService.insert(bookBean);
return JSON.toJSONString(result);
}`
更改后传值时,参数要和bean中的属性相对应
更改后代码:
methods:{
add:function(){
this.books.push(this.book);
//console.log(JSON.stringify(this.book));
this.$http.post('demoController/add.do',
{
id:this.book.id,
author:this.book.author,
name1:this.book.name1,
price:this.book.price
},
{emulateJSON:true})
.then(function(res){
console.log(res);
},function(){
console.log('请求失败处理');
})