准备后端接口服务环境

准备后端接口服务环境(了解)

安装全局工具 json-server (全局工具仅需要安装一次)

sh 复制代码
yarn global add json-server 或 npm i json-server  -g

代码根目录新建一个 db 目录

在db目录新建 index.json 文件

json 复制代码
{
"cart": [
 {
   "id": 100001,
   "name": "低帮城市休闲户外鞋天然牛皮COOLMAX纤维",
   "price": 128,
   "count": 1,
   "thumb": "https://yanxuan-item.nosdn.127.net/3a56a913e687dc2279473e325ea770a9.jpg"
 },
 {
   "id": 100002,
   "name": "网易味央黑猪猪肘330g*1袋",
   "price": 39,
   "count": 14,
   "thumb": "https://yanxuan-item.nosdn.127.net/d0a56474a8443cf6abd5afc539aa2476.jpg"
 },
 {
   "id": 100003,
   "name": "KENROLL男女简洁多彩一片式室外拖",
   "price": 128,
   "count": 2,
   "thumb": "https://yanxuan-item.nosdn.127.net/eb1556fcc59e2fd98d9b0bc201dd4409.jpg"
 },
 {
   "id": 100004,
   "name": "云音乐定制IN系列intar民谣木吉他",
   "price": 589,
   "count": 1,
   "thumb": "https://yanxuan-item.nosdn.127.net/4d825431a3587edb63cb165166f8fc76.jpg"
   }
]
}

进入 db 目录,执行命令,启动后端接口服务 (使用--watch 参数 可以实时监听 json 文件的修改)

sh 复制代码
json-server  --watch  index.json

当服务启动后,可以访问http://localhost:3000/cart获取数据

相关推荐
影子落人间3 分钟前
已解决npm ERR! request to https://registry.npm.taobao.org/@vant%2farea-data failed
前端·npm·node.js
世俗ˊ27 分钟前
CSS入门笔记
前端·css·笔记
子非鱼92128 分钟前
【前端】ES6:Set与Map
前端·javascript·es6
6230_32 分钟前
git使用“保姆级”教程1——简介及配置项设置
前端·git·学习·html·web3·学习方法·改行学it
想退休的搬砖人41 分钟前
vue选项式写法项目案例(购物车)
前端·javascript·vue.js
加勒比海涛1 小时前
HTML 揭秘:HTML 编码快速入门
前端·html
啥子花道1 小时前
Vue3.4 中 v-model 双向数据绑定新玩法详解
前端·javascript·vue.js
麒麟而非淇淋1 小时前
AJAX 入门 day3
前端·javascript·ajax
茶茶只知道学习1 小时前
通过鼠标移动来调整两个盒子的宽度(响应式)
前端·javascript·css
清汤饺子1 小时前
实践指南之网页转PDF
前端·javascript·react.js