总体架构：
// 实例化vue对象（MVVM中的View Model）
???new Vue({
???????// vm控制的区块为id为app的div，此div中的所有vue指令均可以被vm解析
???????el:‘#app‘,
???????data:{
???????// 数据 （MVVM中的Model） ??
???????name:"",
???????price:"",
???????num:"",
???????pic:""
???????},
???????//页面加载执行方法
???????created: function () {
//设置请求路径
???????????var url ?= "http://www.tptp.com/"; ???????????????
???????????// 发送请求:将数据返回到一个回到函数中
???????????_this= this;
???????????// 并且响应成功以后会执行then方法中的回调函数
???????????axios.get(url).then(function(result) {
???????????????// result是所有的返回回来的数据
???????????????// 包括了响应报文行
???????????????// 响应报文头
???????????????// 响应报文体
???????????????console.log(result.data.data.goods_pic);
???????????????_this.name = result.data.data.goods_name;
???????????????_this.price = result.data.data.goods_price;
???????????????_this.num = result.data.data.goods_num;
???????????????_this.pic = url+‘uploads‘+‘/‘+result.data.data.goods_pic;
???????????}); ?
???????},
???????//事件
???????methods:{
???????????jia:function(){
this.num++
},
jian:function(){
if(this.num >1){
this.num--;
}else{
alert("请求出错");
}
},
addtocar:function() {
????????????????var url = "http://www.tptp.com/index/Index/addtocar";
????????????????var num = _this.num;
????????????????var price = _this.price;
????????????????// post有两个参数
????????????????//参数1:请求的路径
????????????????//参数2:提交的参数
????????????????//提交参数的两种形态:
????????????????// ?????????1.可以直接传入字符串 name=张三&age=19
????????????????// ?????????2.可以以对象的形式传入{name:"三",age:19}
????????????????axios.post(url,{num:num}).then(function(res) {
???????????????????console.log(res);
????????????????});
????????????}
???????}
???})
vue.js 学习内容总结
原文地址：https://www.cnblogs.com/senio/p/10119709.html