我先说我的操作步骤:(前提是要有node.js没有的npm吧)
第一步:新建一个文件夹,命名随便;然后在文件里打开命令行输入以下命令
npm init -y
npm i express
文件夹就会多一个node_moudules文件和两个json文件
接下来在自己的编辑器上新建一个app.js文件,内容如下
const express = require('express')
const bodyParser = require('body-parser')///npm i body-parser自己去下载,用于post请求的
const app = express()
app.use(bodyParser.urlencoded({
extended: false
}))
//parse application/json
app.use(bodyParser.json())
const broadcast = [{
carouselImg: '../../assets/images/carousel1.jpg'
},
{
carouselImg: '../../assets/images/carousel2.jpg'
},
{
carouselImg: '../../assets/images/carousel3.jpg'
},
{
carouselImg: '../../assets/images/carousel4.jpg'
}
]
const todos = [{
code: 0,
id: 1,
name: '小敏',
years: '22',
img: "../../../static/images/a1.png"
},
{
code: 0,
id: 2,
name: '小张',
years: '22',
img: "../../../static/images/a2.png"
},
{
code: 0,
id: 3,
name: 'like',
years: '22',
img: "../../../static/images/a3.png"
},
{
code: 0,
id: 4,
name: 'like',
years: '22',
img: "../../../static/images/a4.png"
},
{
code: 0,
id: 5,
name: 'like',
years: '22',
img: "../../../static/images/a5.png"
},
{
code: 0,
id: 6,
name: 'like',
years: '22',
img: "../../../static/images/a5.png"
},
{
code: 0,
id: 7,
name: 'like',
years: '22',
img: "../../../static/images/a2.png"
},
{
code: 0,
id: 8,
name: 'like',
years: '22',
img: "../../../static/images/a3.png"
},
{
code: 0,
id: 9,
name: 'like',
years: '22',
img: "../../../static/images/a4.png"
},
{
code: 0,
id: 10,
name: 'like',
years: '22',
img: "../../../static/images/a5.png"
},
{
code: 0,
id: 11,
name: 'like',
years: '22',
img: "../../../static/images/a5.png"
},
{
code: 0,
id: 12,
name: 'like',
years: '22',
img: "../../../static/images/a5.png"
},
{
code: 0,
id: 13,
name: 'like',
years: '22',
img: "../../../static/images/a5.png"
},
{
code: 0,
id: 14,
name: 'like',
years: '22',
img: "../../../static/images/a5.png"
}
]
const longitude = [
{
code: 0,
latitude: '39.91667', //纬度
longitude: '116.41667', //经度
address: {
geohash: '39.91667,116.41667',
city: '北京市',
latitude: '39.91667', //纬度
longitude: '116.41667' //经度
}
},
{
code: 0,
latitude: '34.50000',
longitude: '121.43333',
address: {
geohash: '34.50000,121.43333',
city: '上海市',
latitude: '34.50000',
longitude: '121.43333'
}
},
{
code: 0,
latitude: '30.66667',
longitude: '104.06667',
address: {
geohash: '30.66667,104.06667',
city: '成都市武侯区天府大道中段500号',
latitude: '30.66667',
longitude: '104.06667'
}
}
]
app
.get('/broadcast', (req, res) => {
res.json(broadcast)
})
.get('/todos', (req, res) => {
res.json(todos)
})
.get('/longitude', (req, res) => {
//console.log(req)
let id = req.query.id
for(let i = 0; i < longitude.length; i++) {
if(longitude[i].address.geohash == id) {
res.json({
address: longitude[i]
})
return
}
}
})
.post('/todos', (req, res) => {
console.log(req.body)
const todo = {
name: req.body.name,
years: req.body.years,
id: todos[todos.length - 1].id + 1
}
todos.push(todo)
res.json(todo)
})
app.listen(3000, () => console.log('api server running 3000.'))
然后呢再在这个根文件里输入 nodemon app.js
这样自己模拟的服务器接口数据就跑起了。
举例请求一个get数据todos
axios.get('http://192.168.0.121:3000/todos').then(res => {
console.log(res)
this.lists = res.data
console.log(this.lists)
//this.lists = JSON.parse(localStorage.getItem('zhi')) || this.lists;
let get=JSON.parse(localStorage.getItem("zhi"));
console.log(get)
if(get!=null){
this.lists=get
}else{
this.lists= this.lists
}
localStorage.setItem('zhi', JSON.stringify(this.lists));
console.log(this.lists)
}, err => {
console.log(err)
})