前端开发的时候,总会需要写一些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. 使用FastReport报表工具生成报表PDF文档

    在我们开发某个系统的时候,客户总会提出一些特定的报表需求,固定的报表格式符合他们的业务处理需要,也贴合他们的工作场景,因此我们尽可能做出符合他们实际需要的报表,这样我们的系统会得到更好的认同感.本篇随 ...

  2. POJ-2083 Fractal-X星阵图

    Description A fractal is an object or quantity that displays self-similarity, in a somewhat technica ...

  3. Windows SDK version 8.1 下载地址

    Windows SDK version 8.1 下载地址 https://go.microsoft.com/fwlink/p/?LinkId=323507

  4. [Mathematics][MIT 18.02]Detailed discussions about 2-D and 3-D integral and their connections

    Since it is just a sort of discussion, I will just give the formula and condition without proving th ...

  5. Python3字符串常见方法

    目录 字符串的进阶使用 格式化输出字符串 当然除了上述方法外,还可以你使用format方法 format方法第二种用法: Python字符串与二进制的转换 字母大写 计字符a出现的次数 输出50个字符 ...

  6. phpstudy后门rce批量利用脚本

    写两个 一个批量检测的  一个交互式shell的 暂时py  图形化的qt写出来..有点问题 后门包 : GET / HTTP/1.1Host: 127.0.0.1User-Agent: Mozill ...

  7. 爬虫4:pdf页面+pdfminer模块+demo

    本文介绍下pdf页面的爬取,需要借助pdfminer模块 demo一般流程: 1)设置url url = 'http://www.------' + '.PDF' 2)requests模块获取url ...

  8. CSP-S 初赛内容整理

    图灵奖 艾伦·麦席森·图灵(Alan Mathison Turing,1912-1954)1966 共计70名科学家获此殊荣,华人仅有1位,他是2000年姚期智. 解释型语言 Python / Jav ...

  9. [NOIp2018] luogu P5020 货币系统

    还在补暑假作业. 题目描述 你有一个由 NNN 种面值的货币组成的货币系统.定义两个货币系统等价,当且仅当 ∀x∈N∗\forall x\in\N^*∀x∈N∗ 要么同时能被两个货币系统表示,要么同时 ...

  10. vue在一个方法执行完后再执行另一个方法

    vue在一个方法执行完后执行另一个方法 用Promise来实现.Promise是ES6的新特性,用于处理异步操作逻辑,用过给Promise添加then和catch函数,处理成功和失败的情况 ES7中新 ...