zoukankan      html  css  js  c++  java
  • 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();
            }
        }
  • 相关阅读:
    ArcEngine 图层渲染(转)
    新年快乐!
    js限制输入(转载)
    ArcEngine中使用上下左右键移动地图
    ArcEngine 渲染的使用
    Geometry 对象浅析
    AE数据加载
    基于arcgis server地图页面设计备忘
    AO中的一些基础类和接口
    ArcGIS Server 9.2数据加载
  • 原文地址:https://www.cnblogs.com/ddqyc/p/13628086.html
Copyright © 2011-2022 走看看