11. react 基础 使用charles 模拟接口数据
模拟数据
模拟 axios 请求的数据
eg:
1. 编写 axios 请求
axios.get('/api/xxx')
.then(()=>{alert('succ')})
.catch(()=>{alert('err')})
2. 在 Desktop (桌面) 创建一个xxx.json文件
cd ~/Desktop
touch xxx.json
3. 编辑 xxx.json
["zone", "hoo"]
4. axios 发起请求时 返回 xxx.json内的数据
选择 charles
选择 上面的 Tools
选择 Map Local...
添加 选中 Enable Map Local
点击 Add
Protocol : http
Host : localhost
Port : 3000
Path : /api/xxx
Query :
Local path : ~/Desktop/xxx.json
5. 访问 http://localhost:3000/api/xxx
6. 结合 this.setState 赋予初始值
this.axios.get('/api/xxx')
.then((res)=>{
this.setState(()=>({
list : [...res.data]
}))
})
