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

2019-11-15  本文已影响0人  Do_Du

公用模块

新建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

上一篇 下一篇

猜你喜欢

热点阅读