mpvue开发微信小程序,Fly.js 简单使用

小程序原生wx.request是小程序平台特定api ,不能运用到web导致mpvue小程序转web时,需要重写网络请求部分代码。为了解决平台差异,代码复用 ,fly.js将平台差异在底层屏蔽,支持切换底层 Http Engine,可轻松适配各种运行环境,只是入口文件不同。
Fly基于Promise提供了Restful API,你可以方便的使用它们,具体请参考fly 文档

1.引入fly

npm install flyio
var Fly=require("flyio/dist/npm/wx") 
var fly=new Fly

2.在mpvue中使用

  • main.js

// main.js
// 将fly实例挂在vue原型上,在然而你和组件中通过this使用fly
var Fly=require("flyio/dist/npm/wx") 
var fly=new Fly
fly.config.baseURL='http://xx.xx.xx.xx:xxxx/api/v3/' // 配置请求基地址
Vue.prototype.$http=fly // 将fly实例挂在vue原型上
  • index.vue

<template>
  <div>
    <div @click="getData()">获取数据</div>
  </div>
</template>

<script>
export default {
  methods: {
    getData () {
      let url = 'xxx/xxxx'
      let param = {
        flag: 1,
        access_token: 'xxxxxxxx'
      }
      this.$http.get(url, param).then((res)=>{
        console.log('res', res)
      }).catch(err=>{
      })
    }
  }
}
</script>

相关推荐