uniapp请求数据方法 和二次封装

页面vue文件中请求方法
uni.request({ //获取信息 url: getApp().globalData.https + '/api.php/Index/index', data: {}, method: 'POST', header: getApp().globalData.header, dataType: 'json', success: function(res) { console.log(res); } })

APP.vue 文件中设置全局变量
<script> export default { globalData: { text: 'text', https: "https://www.19870125.xyz", header: { 'content-type': 'application/x-www-form-urlencoded' }, }, onLaunch: function() { console.log('App Launch') }, onShow: function() { console.log('App Show') }, onHide: function() { console.log('App Hide') } } </script> <style> /*每个页面公共css */ </style>

 

二次封装求取方法

新建文件夹util   文件api.js

 

 

const BASE_URL="https://www.19870125.xyz";  //域名抽取
const HEADER={ 'content-type': 'application/x-www-form-urlencoded' };  //头部
export const myRequest=(options)=>{
    return new Promise((resolve,reject)=>{
        uni.request({
            url:BASE_URL+options.url,
            method:options.method||'GET',
            header: HEADER,
            data:options.data||{},
            dataType: 'json',
            success:(res)=>{
                // if(res.data.status!==0){
                //     return uni.showToast({
                //         title:"获取数据失败"
                //     })
                // }
                resolve(res)
            },
            fail:(err)=>{
                reject(err);
            }
        })
    })
}

在  main.js中引用

import Vue from 'vue'
import App from './App'


//引入 import { myRequest } from './util/api.js' //在原型中挂载 Vue.prototype.$myRequest=myRequest;

Vue.config.productionTip
= false App.mpType = 'app' const app = new Vue({ ...App }) app.$mount()

 

 

在页面中调用封装方法

 

 

export default {
        data() {
            return {

            }
        },
        methods: {
            async getSwipers() {
                const res=await this.$myRequest({
                    url: '/api.php/Index/index',
                    methods: "POST"
                })
                console.log("getSwipers",res);
            }
        },
        onLoad() {
            this.getSwipers();
        }
    }

 

posted @ 2020-09-07 17:33  青幽草  阅读(2391)  评论(0编辑  收藏  举报