MPVue 開發(fā)小程序的通用能力封裝Promisify 的 wx APIimport { wxp } from 'common-mpvue'; wxp.request({ ...config }).then(resp => { // do something }); import { PersistStore } from 'common-mpvue'; const store = new PersistStore({ ...storeOptions }); 方便不同頁面間通信,為保證同一個 emitter 實例,請通過getApp().emitter獲取這個綁定在 app 下的 emitter 實例 const app = getApp(); // 添加監(jiān)聽 app.emitter.on('event1', function() {}); // 添加一次性監(jiān)聽 app.emitter.once('event1', function() {}); // 移除監(jiān)聽 app.emitter.off('event1', listener); // 移除全部監(jiān)聽 app.emitter.offAll('event1'); 解決了頁面棧過大時無法跳轉(zhuǎn)的問題,自動使用redirectTo替代navigateTo const app = new App(); app.nav.navigateTo('/pages/index/index', { param1: '1' }); app.nav.navigateToH5('https://example.com'); Utilities 提供少量的實用方法 const app = getApp(); // 給url添加query參數(shù) app.utils.addUrlQuery('/pages/index/index', { param1: '1' }); // 解析url的query為對象 app.utils.parseUrlQuery('/pages/index/index?param1=1'); 提供了封裝的 Request 對象,適度的請求隊列管理,建議使用wx.httpRequest或wxp.httpRequest wx.httpRequest.httpGet('https://example.com', { param1: '1' }); // json形式post wx.httpRequest.httpJsonPost('https://example.com', { data1: '1' }, { ...requestOptions }); // form表單形式post wx.httpRequest.httpFormPost('https://example.com', { data1: '1' }, { ...requestOptions }); // httpPost等同httpFormPost wx.httpRequest.httpPost('https://example.com', { data1: '1' }, { ...requestOptions }); 為了減少重復(fù)填寫配置,可以重新實例化一個有固定配置的請求實例 // 配置請求攜帶token并以cookie形式傳遞 const httpRequest = wx.httpRequest .auth() .cookieToken() .form(); httpRequest.GET('https://example.com'); httpRequest.POST('https://example.com', { data1: '1' }); 目前支持如下配置鏈
為了將這些能力引入到 app,wx,wxp 等對象上,需要按如下操作:入口 main.js import { wrap } from 'common-mpvue'; import App from './index.vue'; wrap(App); import { WrapPage } from 'common-mpvue'; import Page from './index.vue'; new WrapPage(Page); // 或者為頁面添加vuex store new WrapPage(Page, { state() { name: ''; }, mutations: { updateName(state, name) { state.name = name; } } }); 在頁面的 vue 單文件組件內(nèi),可以通過this.$app訪問小程序 app 實例,可以通過this.$store訪問共享的業(yè)務(wù) vuex store,可以通過this.$state訪問該頁面的狀態(tài)模塊 |
工作日 8:30-12:00 14:30-18:00
周六及部分節(jié)假日提供值班服務(wù)