我们创建好mpvue项目之后,找到src/main.js打开在后面添加一行代码

(注意:不能在const app = new Vue(App) 之前添加)

Vue.prototype.globalData = getApp().globalData

这行代码的意思就是,将小程序的全局变量,挂载在Vue的原型上,这样我们在不同的页面就都可以获取到全局数据了

不同页面使用 this.globalData获取或者添加修改既可

比方说我需要存储用户一些基本信息可以这样

this.globalData.userInfo = {name:aaa}

不同页面获取方式一样

console.log(this.globalData.userInfo.name)

修改

this.globalData.userInfo.name = 'bbb'

踩坑注意:在小程序启动的时候,不同页面中vue周期函数created中的代码都会执行一遍。所以vue中created周期函数中尽量不要请求太多接口。而是放在小程序的周期函数onLoad中。

原文链接:https://blog.csdn.net/chjcode/article/details/82020346

使用mpvue开发小程序如何定义全局变量的更多相关文章

  1. 使用mpvue开发小程序教程(二)

    在上篇文章中,我们介绍了使用mpvue开发小程序所需要的一些开发环境的搭建,并创建了第一个mpvue小程序代码骨架并将其运行起来.在本文中,我们来研究熟悉一下mpvue项目的主要目录和文件结构. 在V ...

  2. 使用mpvue开发小程序教程(四)

    在上一章节中,我们将vue-cli命令行工具生成的代码骨架中的src目录清理了一遍,然后从头开始配置和编写了一个可以运行的小程序页面,算是正真走上了使用mpvue开发小程序的第一步.今天我们将进一步来 ...

  3. 使用mpvue开发小程序教程(五)

    在上一章节中,我们了解了组件的三个基本特性以及组件的基本使用方法.在实际的小程序开发中,我们应该以组件的思维去设计每个小程序的功能页面,对其进行合理的组件拆分,让每个部分都保持功能简洁.条理清楚.各司 ...

  4. 使用mpvue开发小程序

    前言: 最近接到小程序的开发需求,由于之前也没开发过小程序,心情还是有点激动.先花15分钟看一遍小程序官方文档,再花10分钟看一遍mpvue官方文档,然后拿着原型图和UI图就开干.踩了不少坑,写篇博客 ...

  5. 使用mpvue开发小程序教程(一)

    前段时间,美团开源了mpvue这个项目,使得我们又多了一种用来开发小程序的框架选项.由于mpvue框架是完全基于Vue框架的(重写了其runtime和compiler),因此在用法上面是高度和Vue一 ...

  6. 使用mpvue开发小程序教程(三)

    在上一篇文章中,我们熟悉了一下通过vue-cli生成的mpvue工程代码骨架的基本结构,大致了解了每一个部分的代码到底要放到何处.从本文起我们就开始涉及真正的编码部分,学习使用Vue的语法去编写小程序 ...

  7. 学习笔记:mpvue开发小程序——入门

    接下来可能要开发一个小程序,同事推荐使用mpvue,那么我提前熟悉下. 官网地址:http://mpvue.com/ 1.快速上手 http://mpvue.com/mpvue/quickstart/ ...

  8. 使用mpvue开发小程序教程(六)

    在上一章节中,我们列举了在Vue中能用但在mpvue中不能用或需要特别注意的特性,在实际开发前了解一下还是很有必要的,可以避免浪费找错误的时间. 如果你使用过原生的小程序框架,你一定经历过或思考过怎么 ...

  9. mpvue 开发小程序接口数据统一管理

    mpvue项目里做API与数据分离统一管理 小程序里请求数据接口使用wx:request,因为考虑项目比较大,最好把wx:request封装起来,统一使用管理 utils.js 配置开发环境和线上环境 ...

随机推荐

  1. qtp10安装步骤(比较完整)

    在安装qtp之前,要提前安装软件(不知道是干嘛的,反正安装就完了),右键--管理员运行完成安装,如下图: 解压qtp镜像: 双击setup: 第一步,点击第一排 第二步, 注:安装QTP系统提示“ 计 ...

  2. Django中ORM中的get与filter区别

    本文出自 “orangleliu笔记本” 博客,出处http://blog.csdn.net/orangleliu/article/details/38597593 Django的orm中get和fi ...

  3. scrapydweb的初步使用(管理分布式爬虫)

    https://github.com/my8100/files/blob/master/scrapydweb/README_CN.md 一.安装配置 1.请先确保所有主机都已经安装和启动 Scrapy ...

  4. 微信小程序开发(一)开发工具推荐VSCode

    虽然微信小程序官方开发工具非常优秀,但用的时间久了,会发现一些问题,比如代码编辑区小,自定义能力差,不支持插件,有时还会出现莫名其妙的bug,最不能忍的是编辑器代码提示功能不健全,这对于新手来说,很不 ...

  5. mvc5+ET6入门第一章

    这一篇主要讲的是MVC也就是Model--View--Controller的缩写,没有讲ET.其中 Model(模型)表示应用程序核心(比如数据库记录列表).通常模型对象在数据库中存取数据. View ...

  6. 一个简单的方法去掉angular application中URLs的hashtag

    本文转载自:Pretty URLs in AngularJS: Removing the # By default, AngularJS will route URLs with a hashtag. ...

  7. Selenium系列(四) - 鼠标、键盘操作详细解读

    如果你还想从头学起Selenium,可以看看这个系列的文章哦! https://www.cnblogs.com/poloyy/category/1680176.html 其次,如果你不懂前端基础知识, ...

  8. 将Mongodb的表导入到Hive中

    1.官方文档:https://docs.mongodb.com/ecosystem/tools/hadoop/ 2.Hive介绍: Hive特点: 1.hive是一个数据仓库,和oracle,mysq ...

  9. python之面向对象函数与方法,反射,双下方法

    一.函数和方法 1.函数和方法的区别 函数: 全都是显性传参,手动传参,与对象无关 方法: 存在隐性传参,与对象有关 1.1通过函数名可以判断 len()就是函数 str.count()就是方法 de ...

  10. CSS3动画的使用以及优化

    CSS3 动画 目录 1. 定义动画2. animation 属性3. animation 属性的兼容4. animation与transition 属性的取别5. animate.css 动画库6. ...