uni-app/vue请求封装

最近公司准备开发一个安卓的app,苦于原生开发的成本和无人会安卓技术,决定采用混合开发来实现。基于低学习成本,最终选择了能较快上手的uni-app技术。

这期间也是一边看文档,一边开发,痛并快乐着。第一次尝试写博客,力求用最简单的文字记录一个项目的开发过程,希望自己能坚持下去!
其实在翻看uni-app的开发文档,不难发现,他的很多语法和vue非常像,比方说数组遍历、条件渲染等,只是将vue的【v】改成了【uni】。

同时其又参考了微信小程序开发的文档,诸多语法也和小程序比较相似,比方说小程序的生命周期、路由跳转以及传值等。所以这篇文章是基于uni-app,但是放之vue微信小程序都是可以参考一番的。

一、测试环境、正式环境

uni-app 可通过 process.env.NODE_ENV 判断当前环境是开发环境还是生产环境,对此我们可以根据这一条件来动态切换连接测试服务器或生产服务器

if(process.env.NODE\_ENV === 'development'){
    console.log('开发环境') 
}else if (process.env.NODE\_ENV === 'production'){
    console.log('生产环境')
}

二、请求封装

1、在项目中新建一个baseconfig.js文件,用于存放项目的接口地址,根据不同的环境分别添加测试接口域名和正式接口域名,然后将变量用export default命令模块指定输出:

var baseconfig = {};
 //测试地址
if (process.env.NODE_ENV === 'development') { 
    baseconfig = {
        server: 'http://test1/api/',
        pdcom: "http://test2/api/", 
    }
    
 //正式地址
} else if (process.env.NODE_ENV === 'production') {  /
    baseconfig &#
  • 0
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值