1.封装请求 可参考我之前的文章
2.创建一个文件 api.js 封装具体的请求
// 导入封装的请求
import request from '@/utils/request.js'
// 导出
export function reqDataList(id){ // 资讯列表
return request({
url: 'mv1/list?id=' + id,
method: 'get'
})
}
3.vuex
import {reqDataList} from '@/api/api.js' // 引入第二步中导出的方法
const state = {
id: ''
}
const mutations = {
id(state, data){
state.id = data
}
}
const actions = {
reqDataList({ commit },data){
const { subject_id } = data // 解构
return new Promise((resolve,reject) => {
reqDataList(data).then(res => {
let data = res.data.id
commit('id', data) // 提交更改 或 this.commit('id', data)
resolve(res)
}).catch(err => {
reject(err)
})
})
}
}
4.页面中调用
methods: {
getList(){
let data = 18 //dispatch 第一个参数是vuex请求路径+ vuex中action中的方法名
this.$store.dispatch('user/reqDataList', data).then(res => {
console.log(res)
})
}
}