Vue自定义函数挂到全局方法

方法一:使用Vue.prototype

//在mian.js中写入函数

Vue.prototype.getToken = function (){
  ...
}

//在所有组件里可调用函数

this.getToken();

方法二:使用exports.install+Vue.prototype

// 写好自己需要的fun.js文件

exports.install = function (Vue, options) {
    Vue.prototype.getToken = function (){
       ...
    };
};

// main.js 引入并使用

import fun from ‘./fun‘
Vue.use(fun);

//在所有组件里可调用函数

this.getToken();

在用了exports.install方法时,运行报错exports is not defined

解决方法

export default {
    install(Vue)  {
        Vue.prototype.getToken = {
           ...
        }
    }
}

方法三:使用全局变量模块文件

Global.vue文件:

<script>
    const token=‘12345678‘;

    export default {
        methods: {
            getToken(){
                ....
            }
        }
    }
</script>

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

<script>
import global from ‘../../components/Global‘//引用模块进来
export default {
    data () {
        return {
            token:global.token
        }
    },
    created: function() {
        global.getToken();
    }
}
</script>

原文地址:https://www.cnblogs.com/conglvse/p/10062449.html

时间: 2024-08-30 14:57:09

Vue自定义函数挂到全局方法的相关文章

Vue自定义过滤器

gitHub地址: https://github.com/lily1010/vue_learn/tree/master/lesson05 一 自定义过滤器(注册在Vue全局) 注意事项: (1)全局方法 Vue.filter() 注册一个自定义过滤器,必须放在Vue实例化前面 (2) 过滤器函数始终以表达式的值作为第一个参数.带引号的参数视为字符串,而不带引号的参数按表达式计算 (3)可以设置两个过滤器参数,前提是这两个过滤器处理的不冲突 (4)用户从input输入的数据在回传到model之前也

smarty 自定义函数

自定义函数:<{方法名称}> 在lib/plugins中新建文件,命名方式是固定的:function.方法名称.php 或者 block.方法名称.php 1.<{literal}><{/literal}> {literal}标签区域内的数据将按字面意思处理,代表性地是用在javascript/css语块周围,不然这些语言使用的花括号‘{’.‘}’会干扰模版定界符语法.{literal}{/literal}标签里面的所有符号不会被解释,全部按原样输出. 例如:在main

PHP之文件引用与自定义函数

PHP文件间的引用 include语言结构 格式:mixed include(string resource); 将一个资源文件resource载入到当前PHP程序中: resource资源是互联网上的某个资源时,需要将配置文件php.ini中的选项allow_url_include设置为On(allow_url_include = On). require语言结构 与include基本相同: 两者区别:使用include时,若发生错误或找不到引用文件,继续执行下面的语句: 使用require时

jquery自定义函数的多种方法

在jquery中自定义函数你会吗?今天抽时间写了几个,个人感觉还不错,喜欢的朋友可以了解下 复制代码 代码如下: //方法定义 $.windowbox = { //定义一个方法aa aa: function(){ alert("aa"); }, //定义一个方法bb bb: function(){ alert("bb"); } } $.windowbox.aa(); //调用$.windowbox里的aa方法 复制代码 代码如下: // 传参数 var aa = f

vue的全局方法和局部方法

var infiniteScroll = require('vue-infinite-scroll') 等价写法 import infiniteScroll from 'vue-infinite-scroll' Vue.use(infiniteScroll) //全局方法 var infiniteScroll = require('vue-infinite-scroll'); new Vue({ directives: {infiniteScroll} //局部方法(使用) })

MySQL下创建序列及创建自定义函数方法介绍

工作过程中需要将基于DB2数据库的应用以及数据迁移到MySQL中去,在原应用中,大量使用了SEQUENCE,考虑尽量减少代码的修改,决定在迁移后的应用中继续保留SEQUENCE的使用,这就要求在MySQL中寻找替代SEQUENCE的解决方案. 在DB2中创建一个SEQUENCE的方法如下: DROP SEQUENCE TRZ_MEMBER.SEQ_TRZ_MEMBER_NO; CREATE SEQUENCE TRZ_MEMBER.SEQ_TRZ_MEMBER_NO AS BIGINT INCRE

Thinkphp模板中使用自定义函数的方法

注意:自定义函数要放在项目应用目录/common/common.php中. 这里是关键. 模板变量的函数调用格式:{$varname|function1|function2=arg1,arg2,### } 说明: { 和 $ 符号之间不能有空格,后面参数的空格就没有问题: ###表示模板变量本身的参数位置 : 支持多个函数,函数之间支持空格 : 支持函数屏蔽功能,在配置文件中可以配置禁止使用的函数列表 : 支持变量缓存功能,重复变量字串不多次解析. 使用例子: {$webTitle|md5|st

vue自定义指令

什么是指令? 指令 (Directives) 是带有 v- 前缀的特殊属性. 它可以写在DOM元素上,对html进行操作.常用的指令比如有:v-if,v-else,v-show,v-for等.这些都是官方直接给定的,另外Vue也允许注册自定义指令,有时这很有用. 自定义指令方法 自定义一个指令很简单,官网给出一个简单的例子,自定义一个聚焦指令v-focus: // 注册一个全局自定义指令 `v-focus` Vue.directive('focus', { // 当被绑定的元素插入到 DOM 中

vue自定义插件及使用

一.Vue插件有什么用 插件通常会为 Vue 添加全局功能.所谓全局:即不需要像组件那样,每次使用他前都需要先引入一次.对于插件只要在最开始引入一次,在任何组件就可以直接使用.(类似于我们在window上添加的方法属性那样,任何地方都可以用)插件能实现的功能没有限制,不过常见下面几种: 通过插件,添加全局方法或者属性通过插件,添加全局资源:指令/过滤器/过渡等通过插件(使用全局 mixin 方法),添加一些组件选项通过插件,添加 Vue 实例方法,通过把它们添加到 Vue.prototype 上