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

　　})

}