vue/uniapp如何定义全局变量供其他页面调用

作者:admin 发布时间:2020-12-18 14:05:42 浏览:1728次
使用uniapp开发项目的时候,很多时候我都需要定义一些全局变量,用于其他页面的调用,这样方便后续的维护。 uniapp实际上就是vue语法,所以写法是一样的。废话少说,维持小超越一贯的作风,直接上演示。 场景:有生产和开发的环境,不同的环境需要调用不同的接口地址。

步骤一、在根目录创建ENV.js文件,文件名你们可以自定义

代码 /* 全局配置文件 */ let ENV_API_URL={ develop:'这里填写开发环境的接口地址',//开发环境接口 production:'这里填写生产环境的接口地址'//生产环境接口 } let url=ENV_API_URL.develop; if(process.env.NODE_ENV === 'development'){ url=ENV_API_URL.develop; console.log('开发环境'); }else{ url=ENV_API_URL.production; console.log('生产环境'); } export const API_URL=url; 备注:系统会自动判断编译环境,然后输出对应的api接口网址

步骤二、在根目录main.js文件内引用env.js 并赋值全局变量

代码 import {API_URL} from './env.js' Vue.prototype.$API_URL=API_URL; 备注:现在引用了env.js文件里的API_URL变量。并且赋值给全局变量$API_URL。

步骤三、在pages目录里,任意vue文件调用$API_URL

用法:this.$API_URL 总结:首先创建一个文件用于管理配置文件,然后再main.js文件里引用并定义全局变量,然后再需要调用的地方进行调用该全局变量名即可。

如需转载请保留本文出处: https://zhe94.com/848.html

上一篇:快速建站之前言:如何建立一个自己的网站
下一篇:uniapp怎么自定义组件供其他页面调用
[uni-app]微信小程序隐私保护指引用户同意窗口代码

[uni-app]微信小程序隐私保护指引用户同意窗口代码

为规范开发者的用户个人信息处理行为,保障用户合法权益,微信要求开发者主动同步微信当前用户已阅读并同意小程序的隐私政策等收集使用规则,方可调用微信提供的隐私接口。
vscode右键运行插件—code runner

vscode右键运行插件—code runner

在VS Code里,能有一种快捷的方式来运行各类的代码,甚至是代码片段。就好了,Code Runner插件支持了 Node.js, Python, C++, Java, PHP, Perl, Ruby, Go等超过40种的语言。下面,我们就来看看如何来玩转Code Runner,提高你的效率。
php中的两个冒号是什么意思?例如Request::header('token')

php中的两个冒号是什么意思?例如Request::header('token')

在PHP中,双冒号(::)被称为范围解析操作符(Scope Resolution Operator),也有时被称为静态调用运算符。它用于引用类中的静态属性、静态方法或常量。
php __construct是什么意思

php __construct是什么意思

在PHP中,__construct是一个魔术方法(Magic Method),用于类的构造函数。当使用new关键字实例化一个对象时,会自动调用该方法。
thinkphp6.*版本的无缝升级到thinkphp8.0版本实操方法

thinkphp6.*版本的无缝升级到thinkphp8.0版本实操方法

ThinkPHP是一个免费开源的,快速、简单的面向对象的轻量级PHP开发框架,是为了敏捷WEB应用开发和简化企业应用开发而诞生的。ThinkPHP诞生十七年来一直秉承简洁实用的设计原则,在保持出色的性能和至简代码的同时,更注重易用性。