vue定义全局变量的方法-创新互联

本文将为大家详细介绍“vue定义全局变量的方法”，内容步骤清晰详细，细节处理妥当，而小编每天都会更新不同的知识点，希望这篇“vue定义全局变量的方法”能够给你意想不到的收获，请大家跟着小编的思路慢慢深入，具体内容如下，一起去收获新知识吧。

网站建设哪家好，找创新互联建站！专注于网页设计、网站建设、微信开发、成都微信小程序、集团企业网站建设等服务项目。为回馈新老客户创新互联还提供了五通桥免费建站欢迎大家使用！

Vue的优点

Vue具体轻量级框架、简单易学、双向数据绑定、组件化、数据和结构的分离、虚拟DOM、运行速度快等优势，Vue中页面使用的是局部刷新，不用每次跳转页面都要请求所有数据和dom，可以大大提升访问速度和用户体验。

在vue项目中如何定义全局变量，全局函数，在项目中，经常有些函数和变量是需要复用，比如说网站服务器地址，从后台拿到的：用户的登录token,用户的地址信息等，这时候就需要设置一波全局变量和全局函数

如何定义全局变量

原理：

设置一个专用的的全局变量模块文件，模块里面定义一些变量初始状态，用exportdefault暴露出去，在main.js里面使用Vue.prototype挂载到vue实例上面或者在其它地方需要使用时，引入该模块便可。

定义全局变量模块文件：

Global.vue文件：

<script>

constserverSrc='www.baidu.com';

consttoken='12345678';

consthasEnter=false;

constuserSite="中国钓鱼岛";

exportdefault

{

userSite,//用户地址

token,//用户token身份

serverSrc,//服务器地址

hasEnter,//用户登录状态

}

</script>

使用方式1：

在需要的地方引用进全局变量模块文件，然后通过文件里面的变量名字获取全局变量参数值。

在text1.vue组件中使用：

<template>

<div>{{token}}</div>

</template>

<script>

importglobal_from'../../components/Global'//引用模块进来

exportdefault{

name:'text',

data(){

return{

token:global_.token,//将全局变量赋值到data里面，也可以直接使用global_.token

}

}

}

</script>

<stylelang="scss"scoped>

</style>

如果你能读到这里，小编希望你对“vue定义全局变量的方法”这一关键问题有了从实践层面最深刻的体会，具体使用情况还需要大家自己动手实践使用过才能领会，如果想阅读更多相关内容的文章，欢迎关注创新互联行业资讯频道！

分享标题：vue定义全局变量的方法-创新互联
链接URL：https://www.cdcxhl.com/article10/deppdo.html

成都网站建设公司_创新互联，为您提供定制开发、App设计、微信公众号、网站设计公司、企业建站、网站建设

广告

声明：本网站发布的内容（图片、视频和文字）以用户投稿、用户转载内容为主，如果涉及侵权请尽快告知，我们将会在第一时间删除。文章观点不代表本网站立场，如需处理请联系客服。电话：028-86922220；邮箱：631063699@qq.com。内容未经允许不得转载，或转载时需注明来源： 创新互联