Vue.js+Koa2移动电商实战7

实战7"/>

Vue.js+Koa2移动电商实战7

easyMock和Axios的使用

　Mock数据准备

{"data": {"advertesPicture": {"PICTURE_ADDRESS": ".gif"},"floor3": [{"goodsId": "9f0fc88cbd5948a4a18d575f15710e62","image": ".jpg"}, {"goodsId": "9f30e1eff327400d8ad961d0e91b0ecd","image": ".jpg"}, {"goodsId": "b919351e5c2b4a3b9c6791d296934c32","image": ".jpg"}, {"goodsId": "6a2a46ff7657441eaa6ccc6136988da3","image": ".jpg"}, {"goodsId": "51a1bd1b303e4bd1a97207d87fc1679e","image": ".jpg"}, {"goodsId": "f0bc788839ab4ef6ac2adbaa4d8b6074","image": ".jpg"}, {"goodsId": "f0bc788839ab4ef6ac2adbaa4d8b6074","image": ".jpg"}],"floor2": [{"goodsId": "2e55ef4dfb39466f8d010e016d3c45a7","image": ".jpg"}, {"goodsId": "59b475fa74584563b7c65a1345d59fbe","image": ".jpg"}, {"goodsId": "0ab2a0cbb439407e8f90d558a070428d","image": ".jpg"}, {"goodsId": "7c75078bfc7746b2a57a0fa4b0933d4a","image": ".jpg"}, {"goodsId": "522a3511f4c545ab9547db074bb51579","image": ".jpg"}],"floorName": {"floor3": "营养奶品","floor2": "新鲜水果","floor1": "休闲食品"},"floor1": [{"goodsId": "06cdf782f37c41b3b4b93e92999c483c","image": ".jpg"}, {"goodsId": "2199b4bb56d247a1b044d5e7d902c942","image": ".jpg"}, {"goodsId": "f0bc788839ab4ef6ac2adbaa4d8b6074","image": ".jpg"}, {"goodsId": "24692e32d27241d095bbfc59106a4229","image": ".jpg"}, {"goodsId": "27f616c8ec0346a6ae7a3667da2ac345","image": ".jpg"}, {"goodsId": "f6e283eb6df44637ae3d0c83e8bd04cd","image": ".jpg"}, {"goodsId": "f0bc788839ab4ef6ac2adbaa4d8b6074","image": ".jpg"}],"category": [{"mallCategoryId": "1","mallCategoryName": "营养鲜果","bxMallSubDto": [{"mallSubId": "2c9f6c946016ea9b016016f79c8e0000","mallCategoryId": "1","mallSubName": "热带水果","comments": null}, {"mallSubId": "402880e86016d1b5016016db9b290001","mallCategoryId": "1","mallSubName": "苹果/梨","comments": null}, {"mallSubId": "402880e86016d1b5016016dbff2f0002","mallCategoryId": "1","mallSubName": "柑橘橙柚","comments": null}, {"mallSubId": "402880e86016d1b5016016dc55bf0003","mallCategoryId": "1","mallSubName": "蓝莓草莓","comments": null}, {"mallSubId": "402880e86016d1b5016016dcd7c50004","mallCategoryId": "1","mallSubName": "葡萄提子","comments": null}, {"mallSubId": "402880e86016d1b5016016de3b100008","mallCategoryId": "1","mallSubName": "净菜","comments": null}, {"mallSubId": "402880e86016d1b5016016dd052e0005","mallCategoryId": "1","mallSubName": "瓜类","comments": null}, {"mallSubId": "402880e86016d1b5016016dd339c0006","mallCategoryId": "1","mallSubName": "鲜果切","comments": null}, {"mallSubId": "402880e86016d1b5016016de0d400007","mallCategoryId": "1","mallSubName": "叶菜","comments": null}, {"mallSubId": "402880e86016d1b5016016de85870009","mallCategoryId": "1","mallSubName": "根茎类","comments": null}, {"mallSubId": "402880e86016d1b5016016dec183000a","mallCategoryId": "1","mallSubName": "菌菇类","comments": null}],"comments": null,"image": ".png"}, {"mallCategoryId": "2","mallCategoryName": "蔬菜肉类","bxMallSubDto": [{"mallSubId": "402880e86016d1b5016016deffa0000b","mallCategoryId": "2","mallSubName": "猪肉","comments": null}, {"mallSubId": "402880e86016d1b5016016df1f92000c","mallCategoryId": "2","mallSubName": "牛肉","comments": null}, {"mallSubId": "402880e86016d1b5016016df3d1f000d","mallCategoryId": "2","mallSubName": "羊肉","comments": null}, {"mallSubId": "402880e86016d1b5016016df7c0e000e","mallCategoryId": "2","mallSubName": "鸡鸭禽肉","comments": null}, {"mallSubId": "402880e86016d1b5016016e0241d000f","mallCategoryId": "2","mallSubName": "鲜蛋蛋品","comments": null}, {"mallSubId": "402880e86016d1b5016016e083f10010","mallCategoryId": "2","mallSubName": "火锅肉片","comments": null}, {"mallSubId": "2c9f6c9460337d540160337fefd60000","mallCategoryId": "2","mallSubName": "水产","comments": null}],"comments": null,"image": ".jpg"}, {"mallCategoryId": "3","mallCategoryName": "牛奶酸奶","bxMallSubDto": [{"mallSubId": "402880e86016d1b5016016e135440011","mallCategoryId": "3","mallSubName": "鲜奶","comments": ""}, {"mallSubId": "402880e86016d1b5016016e171cc0012","mallCategoryId": "3","mallSubName": "酸奶","comments": ""}, {"mallSubId": "402880e86016d1b5016016e240e60013","mallCategoryId": "3","mallSubName": "乳酸菌","comments": ""}],"comments": null,"image": ".jpg"}, {"mallCategoryId": "4","mallCategoryName": "粮油副食","bxMallSubDto": [{"mallSubId": "402880e86016d1b5016016e2dcc80016","mallCategoryId": "4","mallSubName": "调味料","comments": null}, {"mallSubId": "402880e86016d1b5016016e38a3a0017","mallCategoryId": "4","mallSubName": "健康杂粮","comments": null}, {"mallSubId": "402880e86016d1b5016016e3aa370018","mallCategoryId": "4","mallSubName": "干货","comments": null}, {"mallSubId": "402880e86016d1b5016016e3d09d0019","mallCategoryId": "4","mallSubName": "方便速食","comments": null}, {"mallSubId": "402880e86016d1b5016016e3f70c001a","mallCategoryId": "4","mallSubName": "罐头酱菜","comments": null}, {"mallSubId": "402880e86016d1b5016016e42c22001b","mallCategoryId": "4","mallSubName": "米面粉","comments": null}, {"mallSubId": "402880e86016d1b5016016e458ca001c","mallCategoryId": "4","mallSubName": "烹饪油","comments": null}],"comments": null,"image": ".jpg"}, {"mallCategoryId": "5","mallCategoryName": "零食饮料","bxMallSubDto": [{"mallSubId": "402880e86016d1b5016016e4ac16001d","mallCategoryId": "5","mallSubName": "坚果炒货","comments": null}, {"mallSubId": "402880e86016d1b5016016e4dca2001e","mallCategoryId": "5","mallSubName": "风味小食","comments": null}, {"mallSubId": "402880e86016d1b5016016e51380001f","mallCategoryId": "5","mallSubName": "膨化食品","comments": null}, {"mallSubId": "402880e86016d1b5016016e549710020","mallCategoryId": "5","mallSubName": "饮用水","comments": ""}, {"mallSubId": "402880e86016d1b5016016e62bbd0021","mallCategoryId": "5","mallSubName": "碳酸饮料","comments": null}, {"mallSubId": "402880e86016d1b5016016e656c50022","mallCategoryId": "5","mallSubName": "果蔬汁","comments": null}, {"mallSubId": "2c9f6c946016f86f01601709335d0000","mallCategoryId": "5","mallSubName": "乳制饮料","comments": null}, {"mallSubId": "402880e86016d1b5016016e67b790023","mallCategoryId": "5","mallSubName": "啤酒","comments": null}, {"mallSubId": "402880e86016d1b5016016e713540024","mallCategoryId": "5","mallSubName": "白/黄/果酒","comments": null}, {"mallSubId": "2c9195006076dbc50160781e03bf0013","mallCategoryId": "5","mallSubName": "咖啡茶饮","comments": null}],"comments": null,"image": ".jpg"}],"slides": [{"image": ".jpg","goodsId": "2199b4bb56d247a1b044d5e7d902c942"}, {"image": ".jpg","goodsId": "91a849140de24546b0de9e23d85399a3"}, {"image": ".jpg","goodsId": "c68a7668cceb4168ab48ae0aa312a67d"}],"buyTime": "08:00:00-20:30:00","hotGoods": [{"mallPrice": 12,"image": ".jpg","goodsId": "22fece1309b547069fedb8bfd4a9a855","price": 15,"name": "越南火龙果（大）1*2(约1000g)"}, {"mallPrice": 24,"image": ".jpg","goodsId": "c68a7668cceb4168ab48ae0aa312a67d","price": 28,"name": "越南红心火龙果1*2（约1200g）"}, {"mallPrice": 69,"image": ".jpg","goodsId": "27f616c8ec0346a6ae7a3667da2ac345","price": 75,"name": "多宝鱼 1.5斤左右"}, {"mallPrice": 599,"image": ".jpg","goodsId": "f0bc788839ab4ef6ac2adbaa4d8b6074","price": 650,"name": "阿拉斯加帝王蟹 3斤左右"}, {"mallPrice": 69,"image": ".jpg","goodsId": "06cdf782f37c41b3b4b93e92999c483c","price": 80,"name": "面包蟹 400g"}, {"mallPrice": 30,"image": ".jpg","goodsId": "f6e283eb6df44637ae3d0c83e8bd04cd","price": 38,"name": "虾夷扇贝 10个/份"}, {"mallPrice": 199,"image": ".jpg","goodsId": "2199b4bb56d247a1b044d5e7d902c942","price": 258,"name": "波士顿活龙虾 1.5斤左右"}, {"mallPrice": 59.8,"image": ".jpg","goodsId": "24692e32d27241d095bbfc59106a4229","price": 60,"name": "蓝雪阿根廷红虾500g"}, {"mallPrice": 5.9,"image": ".jpg","goodsId": "51a1bd1b303e4bd1a97207d87fc1679e","price": 11.96,"name": "河北皇冠梨 1*4(约1000g)"}, {"mallPrice": 7.9,"image": ".jpg","goodsId": "9f0fc88cbd5948a4a18d575f15710e62","price": 9,"name": "会理石榴 1*2(约750g)"}, {"mallPrice": 12.5,"image": ".jpg","goodsId": "b919351e5c2b4a3b9c6791d296934c32","price": 15,"name": "福建红肉蜜柚 1*2(约1900g)"}, {"mallPrice": 0.1,"image": ".jpg","goodsId": "9f30e1eff327400d8ad961d0e91b0ecd","price": 14,"name": "四川不知火丑桔 1*4(约1000g)"}, {"mallPrice": 10,"image": ".jpg","goodsId": "6a2a46ff7657441eaa6ccc6136988da3","price": 12,"name": "海南木瓜 1*1(约1000g)"}, {"mallPrice": 7.9,"image": ".jpg","goodsId": "bedfd4bc4d5d46cea41f10355a702a58","price": 9,"name": "君乐宝纯享原味发酵乳330g"}, {"mallPrice": 10,"image": ".jpg","goodsId": "cb3695e66bdc4ac48c5d1d0f28af18dc","price": 46,"name": "完达山炭烧酸奶180g*16袋/箱"}, {"mallPrice": 5.5,"image": ".jpg","goodsId": "0ab2a0cbb439407e8f90d558a070428d","price": 5.5,"name": "蒙牛纯甄经典原味酸牛奶200g"}, {"mallPrice": 22.9,"image": ".jpg","goodsId": "3df3bf7632f74433bf54a1acc5358b42","price": 26,"name": "北大荒绿野有机红小豆390g"}, {"mallPrice": 13.8,"image": ".jpg","goodsId": "2ae28f2ec5f14e9e9f29dfbff0fb10d4","price": 16,"name": "思念手打天下猪肉香菇水饺495g"}, {"mallPrice": 8.6,"image": ".jpg","goodsId": "2a4763fa31cb457481737b9ede14f841","price": 10.5,"name": "双汇大肉块俄式风味香肠30g*8"}, {"mallPrice": 53.8,"image": ".jpg","goodsId": "2c8ad2805463498592910919e4d51260","price": 58,"name": "金健东北贡米5kg"}],"recommend": [{"image": ".jpg","mallPrice": 0.1,"goodsId": "7c75078bfc7746b2a57a0fa4b0933d4a","price": 3.5,"goodsName": "可口可乐樱桃味汽水330ml"}, {"image": ".jpg","mallPrice": 7.9,"goodsId": "9f0fc88cbd5948a4a18d575f15710e62","price": 9,"goodsName": "会理石榴 1*2(约750g)"}, {"image": ".jpg","mallPrice": 24,"goodsId": "c68a7668cceb4168ab48ae0aa312a67d","price": 28,"goodsName": "越南红心火龙果1*2（约1200g）"}],"sendFee": {"chargeStartFee": "59.00","deliveryFee": "0.00"}}}

　　axios的引入

　　直接使用 npm install 进行安装。

npm install --save axios

　　安装之后在要使用的页面组件中进行引入。

import axios from 'axios'

　　然后在created的声明周期里取得数据

created(){axios({url: '',method: 'get',}).then(response => {console.log(response)}).catch((error) => {     })
}

转载于:.html