引用外部js文件(全局变量)

公用模块

新建utils-help.js

const now = Date.now || function() {
    return new Date().getTime()
}

export default {
    now
}

index.vue中引用

import help from '../../utils/help.js'

onLoad() {
    console.log(help.now())
},

挂载 Vue.prototype

将一些使用频率较高的常量或者方法,直接扩展到 Vue.prototype 上,每个 Vue 对象都会“继承”下来。
只需要在 main.js 中定义好即可在每个页面中直接调用。
注意:
1、每个页面中不要在出现重复的属性或方法名。
2、建议在 Vue.prototype 上挂载的属性或方法,可以加一个统一的前缀。比如 $url、global_url 这样,在阅读代码时也容易与当前页面的内容区分开

main.js

import help from './utils/help.js'
Vue.prototype.$help = help

index.vue中引用,这里需要用this引用

onLoad() {
    console.log(this.$help.now())
},

globalData全局变量

在 App.vue 可以定义 globalData ,也可以使用 API 读写这个值。
globalData是一种比较简单的全局变量使用方式。

定义:在App.vue文件中

<script>
    export default {
        globalData:{
            text: 'text'
        },
        onLaunch: function() {
            console.log('App Launch')
        },
        onShow: function() {
            console.log('App Show')
        },
        onHide: function() {
            console.log('App Hide')
        }
    }
</script>

<style>
    /*每个页面公共css */
</style>

js中操作globalData的方式如下:
取值: console.log(getApp().globalData.text) => text
赋值: getApp().globalData.text = 'text2' => text2

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • ## 框架和库的区别?> 框架(framework):一套完整的软件设计架构和**解决方案**。> > 库(lib...
    Rui_bdad阅读 2,989评论 1 4
  • 概要 64学时 3.5学分 章节安排 电子商务网站概况 HTML5+CSS3 JavaScript Node 电子...
    阿啊阿吖丁阅读 9,350评论 0 3
  • 写在前面: 如题,在项目中,经常有些函数和变量是需要复用,比如说网站服务器地址,从后台拿到的:用户的登录token...
    小杰的简书阅读 2,331评论 0 0
  • 前端开发面试题 面试题目: 根据你的等级和职位的变化,入门级到专家级,广度和深度都会有所增加。 题目类型: 理论知...
    怡宝丶阅读 2,611评论 0 7
  • 白白云不喜欢下雨 它要逃走了 黑白云过来 天要黑了 黑色的云彩是被太阳晒黑的吗 燕子在黑云下飞来飞去 它是渴了吗 ...
    半夏扣阅读 176评论 0 0