在Vue中定义一个全局函数的几种方式

最新推荐文章于 2024-02-06 15:23:02 发布

郭宝

最新推荐文章于 2024-02-06 15:23:02 发布

阅读量2.6k

点赞数

CC 4.0 BY-SA版权

分类专栏： Web前端

本文链接：https://blog.youkuaiyun.com/qq_35366269/article/details/97275442

Web前端专栏收录该内容

284 篇文章 ¥99.90 ¥299.90

订阅专栏

超级会员免费看

本文介绍了两种在Vue中定义全局函数的方法：一是通过Vue.prototype在main.js文件中定义并可在任意组件中调用；二是创建自定义js文件，定义函数后在main.js引入，实现全局调用。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

方式一：

通过在main.js文件中的Vue.prototype来定义。

具体步骤：

1、在main.js文件中定义函数

/*
*自定义一个全局函数
*$maxValue  表示自定义的函数名称 
* value1,value2 表示调用该函数时所需传递的参数
* */
Vue.prototype.$maxValue = function(value1,value2){
  console.log("value1:"+value1);
  console.log("value2:"+value2);
  return value1>value2?value1:value2;
};

2、在任意组件中调用该函数

<template>
    <el-form label-position="top" label-width="80px" :model="formLabelAlign" style="padding: 20px;margin: 20px;">
      <el-form-item label="数值1">
        <el-input v-model="formLabelAlign.valueOne" placeholder="请输入数字" clearable></el-input>
      &

了解本专栏