12.【nuxt起步】-接口请求重构

用store把api数据交互部分重构出来，让前端更轻一点

新建 /store/gettter.js /store/actions.js /server/config/index.js

Index.js:

export default {
　　app:{
　　domain:'',
　　host:'localhost',
　　port:3001,
　　routerBaseApi:'api'
　　}
} 

Getter.js:

import globalConfig from '../server/config'
export default {
　　baseUrl(){
　　　　let host
　　　　if (process.env.NODE_ENV === 'production' && globalConfig.app.domain) {
　　　　　　host = `${globalConfig.app.domain}/${globalConfig.app.routerBaseApi}`
　　　　} else {
　　　　　　host = `http://${globalConfig.app.host}:${globalConfig.app.port}/${globalConfig.app.routerBaseApi}`
　　　　}
　　　　return host
},
routerBaseApi(){
　　let routerBaseApi =globalConfig.app.routerBaseApi
　　return routerBaseApi
}
}

Actions.js:

 
import axios from 'axios'
import qs from 'qs'
export default {
　　//信息详情
　　async THREADDETAIL({commit,state,getters}, id = 1) {
　　　　var postData = qs.stringify({
　　　　　　　　　　"Token": "",
　　　　　　　　　　"Plat": 0,
　　　　　　　　　　"TimeStamp": 0,
　　　　　　　　　　"Sign": ""
　　　　　　　　　　});
　　　　let res = await axios({
　　　　　　headers: {'Content-Type': 'application/x-www-form-urlencoded'},
　　　　　　method: 'post',
　　　　　　url: `${getters.baseUrl}/thread/detail?Id=${id}`,
　　　　　　data: postData
　　　　})
　　　　return res.data
}
}

修改 /store/index.js

import Vuex from 'vuex'
import getters from './getters'
import mutations from './mutations'
import actions from './actions'
 
export default () => {
　　return new Vuex.Store({
　　　　getters,
　　　　mutations,
　　　　actions
　　})
}