vue交互取值赋值

交互:
$http （ajax）

如果vue想做交互
引入: vue-resouce


//一个vue文件

get:
this.$http.get(url,{
a:1,
b:2
}).then(function(res){
//成功方法
alert(res.data);
},function(res){
//失败方法
alert(res.status);
});

//post:
this.$http.post('post.php',{
a:1,
b:20
},{
emulateJSON:true //解析json格式
}).then(function(res){
//成功
alert(res.data);
},function(res){
//失败
alert(res.status);
});

// 一个简单的get请求

<div id="box">
<input type="button" value="确定" @click="add()" />
<ul v-for="a in msg"> //数组赋值
<li>{{a.a}}li>
<li>{{a.b}}li>
<li>{{a.c}}li>
ul>
div>
<script>
var aa = new Vue({
el: "#box",
data: {
msg: [] //一个json数组
},
methods: {
add: function() {
this.$http.get({
url: 'home.json', //一个本地的json文件
data: {
//后台发送数据
}
}).then(function(res) {
var data = res.data.data;//取值
for(var i in data) {
this.msg.push({ //把值push到上面的msg里面
a: data[i].title,
b: data[i].tonnage,
c: data[i].moveMode
})
}
})
}
}
})
script>