前端开发的时候,总会需要写一些js函数,在vue框架中为了方便使用,可以考虑注册一个全局的js函数,下面是注册步骤:

1.0 可以在assets文件中的js文件下面新建一个js文件,如:yun.js

2.0 在yun.js 上面实现一个日期格式的函数,如下

import Vue from 'vue'

const format = (o, format) => { //日期类型
let args = {    
"M+": o.getMonth() + 1,
    
"d+": o.getDate(),
    
"h+": o.getHours(),
    
"m+": o.getMinutes(),
    
"s+": o.getSeconds(),
    
"q+": Math.floor((o.getMonth() + 3) / 3), //quarter
"S": o.getMilliseconds()  
};  
if (/(y+)/.test(format)) format = format.replace(RegExp.$1, (o.getFullYear() + "").substr(4 - RegExp.$1.length));  
for (let i in args) {
let n = args[i];    
if (new RegExp("(" + i + ")").test(format)) format = format.replace(RegExp.$1, RegExp.$1.length == 1 ? n : ("00" + n).substr(("" + n).length));  
}  
return format;
} export default function(Vue) {
//添加全局API
Vue.prototype.$yuns = {
format
}
}

3.0 下面将yun.js文件注册到vue的全局中去,需要在main.js文件下面注册全局:如图下

4.0 前面步骤将自定义的js注册到全局去了,后面就可以使用了,如下:

以上就是在vue中注册全局的自定义js文件的步骤,以后需要添加js函数,就在yun.js加上去就可以调用了

vue之注册自定义的全局js方法的更多相关文章

  1. Vue项目零碎知识(全局js,css配置,element-UI,bs使用, img动态配置,js数组)

    全局css样式,首先在静态assets中写好文件,然后要在main.js中配置 // 配置全局css样式 // import '@/assets/css/global.css' require('@/ ...

  2. vue 全局 js 方法

    1.新增 getCurrentDataType.js 文件 import cookieUtils from '@/config/cookieUtils' function getCurrentData ...

  3. vue 中如何对公共css、 js 方法进行单文件统一管理,全局调用

    1.前言 最近,为公司开发交付的一个后台管理系统项目,我使用了 Vue 框架进行开发实践. 模块化.组件化.工程化的开发体验非常好.良好的 api,优雅的设计,对于工程师非常友好. 但是由于模块比较多 ...

  4. Vue中自定义指令的使用方法!

    除了核心功能默认内置的指令 (v-model 和 v-show),Vue 也允许注册自定义指令.注意,在 Vue2.0 中,代码复用和抽象的主要形式是组件.然而,有的情况下,你仍然需要对普通 DOM ...

  5. vue自定义组件(vue.use(),install)+全局组件+局部组件

    相信大家都用过element-ui.mintui.iview等诸如此类的组件库,具体用法请参考:https://www.cnblogs.com/wangtong111/p/11522520.html ...

  6. jira7通过全局js给编辑区自定义快捷键【原】

    jira7编辑区自定义快捷键 本文主要描述了jira7如何通过添加全局js引用,给文本编辑区自定义快捷键用以快速填充模板内容. jira 3/4/5可参考官方api https://developer ...

  7. JS 互相调用iframe页面中js方法、VUE里 iframe 互调方法

    1,父 html 调用子 iframe 内方法: document.getElementById("iframe").contentWindow.func(data1,data2. ...

  8. Vue设置全局的方法和样式

    vue中我么会经常用到通用的一些全局的方法,如何左才能实现全局的复用减少代码累赘呢? 我们一般将公用的方法分装再utils.js文件中,然后再main.js主入口文件中将utils.js中的公共的方法 ...

  9. Vue自动化注册全局组件脚本

    今天有一个idea,vue一些组件,可能会全局都用到,我觉得在main.js写 Vue.component(name, instance) 然后很命令式,写着也不好看,想着能够有一个函数可以指定加载比 ...

随机推荐

  1. 从键盘录入输入3 个数num1,num2,num3,按从大到小进行输出

    本题分别使用嵌套分支语句以及三目运算符来实现,两种方法,可以对比看看. import java.util.Scanner; /** * 从键盘录入输入3 个数a,b,c,按从大到小进行输出 * @au ...

  2. 从零学习基于Python的RobotFramework自动化

    从零学习基于Python的RobotFramework自动化 一.        Python基础 1)      版本差异 版本 编码 语法 其他 2.X ASCII try: raise Type ...

  3. Node Sass could not find a binding for your current environment: OS X 64-bit with Node.js 10.x

    运行Reac项目报: Node Sass could not find a binding for your current environment: OS X 64-bit with Node.js ...

  4. Redis的几个核心机制底层原理

    #### 1.S_DOWN和O_DOWN ######   S_DOWN和O_DOWN两种宕机状态  (1).S_DOWN是主观宕机,就一个哨兵如果自己觉得一个master宕机了,那么就是主观宕机 s ...

  5. Spring Boot Actuator 整合 Prometheus

    简介 Spring Boot 自带监控功能 Actuator,可以帮助实现对程序内部运行情况监控,比如监控状况.Bean加载情况.环境变量.日志信息.线程信息等.这一节结合 Prometheus .G ...

  6. [CF494B] Obsessive String

    Hamed has recently found a string t and suddenly became quite fond of it. He spent several days tryi ...

  7. POST PUT 小解

    POST 主要是用来提交数据让服务器进行处理的,PUT主要是请求数据的. POST 提交的数据放在HTTP正文里面,而PUTT提交的数据放在url里面.

  8. Nginx基本属性配置详解

    1. Nginx服务的基本配置 1.1 用于调试进程和定位问题的配置项 是否以守护进程的方式运行nginx # 默认on daemon on|off; 是否以master/worker方式工作 # 默 ...

  9. 00jmeter安装相关

    1.官网下载安装包:http://jmeter.apache.org/ 下载最新版本: 2.将下载后的zip文件解压 3. jdk与jmeter的环境变量配置(以下变量如果没有则新建,如果已存在则直接 ...

  10. Azure EventHub快速入门和使用心得

    Azure Event Hubs(事件中心)是一个大数据流式数据摄取服务平台,每秒接受数百万事件; EventHubs 是一个有数据保留期限的缓冲区,类似分布式日志:可缩放的关键在于[分区消费模型], ...