生活随笔
收集整理的這篇文章主要介紹了
MockJs案例
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
有時候前端寫好模板后，后端還完工，那么總不能一直讓項目停滯吧，這里就用Mockjs來模擬后端接口的數據，讓我們先人一步完成項目。
首先創建一個html，導入axios和mockjs
再用mock去攔截請求，如果后端接口寫好了，就把mock注釋掉即可，一點不影響項目進展！！
<!DOCTYPE html
>
<html lang
="en">
<head
><meta charset
="UTF-8"><meta name
="viewport" content
="width=device-width, initial-scale=1.0"><title
>Document
</title
>
</head
>
<body
></body
>
<script src
="https://unpkg.com/axios/dist/axios.min.js"></script
>
<script src
="http://mockjs.com/dist/mock.js"></script
>
<script
>axios
.request({methods
:'get',url
:'http://k1998.xyz/www/public/index.php/index/video/add'}).then(res
=>{console
.log(res
.data
);})Mock
.mock('http://k1998.xyz/www/public/index.php/index/video/add',{'data|1-10':[{'id|+1': 1,'vimg': '@image','vname': '@name','vurl' : '@url'}]})</script
>
</html
>
原接口數據
用mock攔截后的數據
數組的長短是隨機的，可能是4也可能是8
這里的data|1-10指的是隨即1到十條數據
id|+1表示每個數據的id加一
其他的@name等就是隨機的名字和圖片地址等
總結
以上是生活随笔為你收集整理的MockJs案例的全部內容，希望文章能夠幫你解決所遇到的問題。
如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。
