【学习打卡】第11天 Vue3 + TS仿知乎专栏企业级项目

课程名称：Vue3 + TS仿知乎专栏企业级项目
课程章节：第7章
主讲老师：张轩

课程内容

今天的课程是vuex结合axios请求后端真实接口的深入使用。
介绍了RESTful API的概念，使用Swagger API的方法，然后结合自己测icode来使用后端的数据，可以看出老师在课程背后准备了很多东西，并且慕课网平台也在持续优化迭代他们的教学服务。
使用axios和vuex的交互复杂起来了，主要是axios数据拦截，请求过程中有loading的效果，返回数据之后使用commit把数据更新，通过computed的方式页面显示返回的数据。

 import App from './App.vue'
 axios.defaults.baseURL = 'http://localhost:7001/api/'
axios.interceptors.request.use(config => {
  store.commit('setLoading', true)
  return config
})

axios.interceptors.response.use(config => {
  store.commit('setLoading', false)
  return config
})
 const app = createApp(App)
 app.use(router)
 app.use(store)

API的请求如果是权限相关的数据，需要使用token在请求中携带上去，在本地需要维护一份数据，token存在的时候主动去请求数据使用的onMounted.

课程收获

温习了swagger, axios 结合vuex的使用，请求拦截然后数据更新，算是比较简单的内容。