mpvue的使用,包含axios、router的集成等完美结合小程序

mpvue开发微信小程序框架的使用注意事项:

  1、路由跳转,引用mpvue-router-patch

  在main.js文件中引入控件:import MpvueRouterPatch from 'mpvue-router-patch'  

              Vue.use(MpvueRouterPatch);

  2、axios的配置注意事项

axios.defaults.adapter = function (config) {

return new Promise((resolve, reject) => {

let param = [];

for (let o in config.params) {

param.push(`${o}=${config.params[o]}`);

}

let wxconfig = {

url: param.length !== 0 ? (config.url + '?' + param.join('&').toString()) : config.url,

method: config.method,

data: config.data,

header: config.headers,

success: function (res) {

resolve(res)

},

fail: function (res) {

reject(res);

}

}

let requestTask = wx.request(wxconfig);

})

}

//HTTPrequest拦截

axios.interceptors.request.use(config => {

if (config.headers.loading != false) {

wx.showLoading({

title: '正在加载中',

mask: true

})

}

const token = store.state.token;

//带入自定义的token标志

if (token) {

config.headers['X-Access-Token'] = token

}

return config

}, error => {

return Promise.reject(error)

})

上述只陈述了几个比较重要的地方。如想了解全部配置以及mpvue使用情况,源代码已上传到码云,欢迎下载参考:Git地址,QQ交流群

                   ①群:699050440

                   ②群:824313640