FE - Weex 使用简单封装数据加载插件为全局加载方法

版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/LABLENET/article/details/78413598

前言

将 weex 的网络加载方式 fetch 简单封装下,在全局组件中进行使用;基本思路:

  • 封装 fetch 插件
  • 在 vue 中进行注册
  • 组件中进行使用

插件封装

如代码所示,注意使用 vue.mixin 方法即可

/**
 * Created by yuan on 2017/11/1.
 * weex 网络请求操作
 */

const BASE_URL = "http://192.168.3.16:8080"
const stream = weex.requireModule('stream')

function get(repo, callback) {
    return stream.fetch({
        method: 'GET',
        type: 'json',
        url: BASE_URL + repo
    }, callback)
}
export default {
    install: function (Vue, options) {
        // 添加的内容写在这个函数里面
        Vue.mixin({
            methods: {
                get: function (repo, callback) {
                    get(repo, callback)
                }
            }
        })
    }
}

注册插件

在 main.js (entry.js )中进行注册插件

import http from './service/http'

// setting http
Vue.use(http)

使用

直接在 组件的 methods 中进行调用即可;

this.get('/login',res=>{

})

猜你喜欢

转载自blog.csdn.net/LABLENET/article/details/78413598
fe