vue3如何使用mock.js呢?
时间: 2023-10-02 15:08:19 浏览: 110
要在Vue3中使用Mock.js可以遵循以下步骤:
1. 首先,安装Mock.js和Axios,可以使用以下命令:
```
npm install mockjs axios --save-dev
```
2. 在Vue3的main.js(或你的入口文件)中,引入Mock.js和Axios:
```javascript
// 引入mockjs
import Mock from 'mockjs'
// 引入axios
import axios from 'axios'
// 设置axios的默认请求头,这里我们设置post请求头为'application/json'。
axios.defaults.headers.post['Content-Type'] = 'application/json'
```
3. 创建一个mock.js文件并编写 Mock 数据:
```javascript
// 引入mockjs
import Mock from 'mockjs'
// mock一组数据
Mock.mock('/api/getData', () => {
return {
data: {
"id": 1,
"name": "Mock.js",
"description": "好用的模拟数据生成工具"
}
}
})
```
4. 在应用中使用mock数据,可以在Vue3组件的mounted()钩子函数中调用axios并使用mock数据:
```javascript
mounted() {
axios.get('/api/getData').then(response => {
console.log(response.data)
})
}
```
以上就是在Vue3中使用Mock.js的简单步骤。
阅读全文