vue如何全局引用公共js
在项目开发中需要调用一些工具类方法,所以需要将公共方法放在公共js中,并且需要全局引用这些公共js
1:创建公共JS(utils.js) src/common/utils.js
- export default {
- text(){
- console.log("测试,测试!!!")
- }
- }
2:在main.js中引入公共js并注册
- import Utils from './common/utils.js';
- Vue.prototype.utils=Utils;
3:调用公共方法
- this.utils.text();
也可以一个一个方法注册:
1:utils.js
- import Vue from 'vue'
import CryptoJS from 'crypto-js'
- export function encrypt(word, keyStr){//加密
- keyStr = keyStr ? keyStr : 'abcdefgabcdefg12';
- var key = CryptoJS.enc.Utf8.parse(keyStr);//Latin1 w8m31+Yy/Nw6thPsMpO5fg==
- var srcs = CryptoJS.enc.Utf8.parse(word);
- var encrypted = CryptoJS.AES.encrypt(srcs, key, {mode:CryptoJS.mode.ECB,padding: CryptoJS.pad.Pkcs7});
- return encrypted.toString();
- }
- export function decrypt(word, keyStr){//解密
- keyStr = keyStr ? keyStr : 'abcdefgabcdefg12';
- var key = CryptoJS.enc.Utf8.parse(keyStr);//Latin1 w8m31+Yy/Nw6thPsMpO5fg==
- var decrypt = CryptoJS.AES.decrypt(word, key, {mode:CryptoJS.mode.ECB,padding: CryptoJS.pad.Pkcs7});
- return CryptoJS.enc.Utf8.stringify(decrypt).toString();
- }
2:在main.js中引入并注册
- import Utils from './common/utils.js';
- Vue.prototype.$encrypt=encrypt;
- Vue.prototype.$decrypt=decrypt;
3:调用
- this.$encrypt("欢迎登录","siR6WLQ9pPE0738Y");
- var aa=this.$encrypt("欢迎登录","siR6WLQ9pPE0738Y");
- this.$decrypt(aa,"siR6WLQ9pPE0738Y");
vue如何全局引用公共js的更多相关文章
- vue的全局引用
1 一般在vue中,有很多vue组件,这些组件每个都是一个文件.都可能需要引用到相同模块(或者插件).我们不想每个文件都import 一次模块. 如果是基于vue.js编写的插件我们可以用 Vue.u ...
- 【vue学习】vue中怎么引用laydate.js日期插件
此贴意在解决一个妹子的问题 https://q.cnblogs.com/q/101462 下载js包 http://www.layui.com/laydate/ 将laydate下载的包解压放入sta ...
- 原生aspx页面如何引用公共js和css
项目过程中遇到一个问题,每个页面需要引用很多的js和css文件,其中很多都是控件,而且大部分都是一样的,造成很多重复引用. 针对这种情况,参考了mvc的BundleConfig,思路是建立一个公用的用 ...
- 【微信小程序】 引用公共js里的方法
一个小程序页面由四个文件组成,一个小程序页面的四个文件具有相同路径与文件名,由此我们可知一个小程序页面对应着一个跟页面同名的js文件.可是当有些公共方法,我们想抽离出来成为一个独立公共的js文件.我们 ...
- vue 调用常量的config.js文件
我遇到问题,就是有很多常量需要应用的项目里面.所以需要打算设置一个config.js文件 1.填写config.js 文件 //常量配置 //快递公司名单 对应的页面为: src/pages/othe ...
- 【转】VUE 爬坑之旅-- 如何对公共JS,CSS进行统一管理,全局调用
原文:https://blog.csdn.net/zgh0711/article/details/78664262 vue 中,将页面分为了各个组件,我们写好组件,就可以将这个组件运用到其他各个页面中 ...
- vue 中如何对公共css、 js 方法进行单文件统一管理,全局调用
1.前言 最近,为公司开发交付的一个后台管理系统项目,我使用了 Vue 框架进行开发实践. 模块化.组件化.工程化的开发体验非常好.良好的 api,优雅的设计,对于工程师非常友好. 但是由于模块比较多 ...
- 如何在Vue中建立全局引用或者全局命令
1 一般在vue中,有很多vue组件,这些组件每个都是一个文件.都可能需要引用到相同模块(或者插件).我们不想每个文件都import 一次模块. 如果是基于vue.js编写的插件我们可以用 Vue.u ...
- 从零开始开发一个vue组件打包并发布到npm (把vue组件打包成一个可以直接引用的js文件)
自己写的组件 有的也挺好的,为了方便以后用自己再用或者给别人用,把组件打包发布到npm是最好不过了,本次打包支持 支持正常的组件调用方式,也支持Vue.use, 也可以直接引用打包好的js文件, 配合 ...
随机推荐
- 使用Hot Chocolate和.NET 6构建GraphQL应用(3) —— 实现Query基础功能
系列导航 使用Hot Chocolate和.NET 6构建GraphQL应用文章索引 需求 在本文中,我们通过一个简单的例子来看一下如何实现一个最简单的GraphQL的接口. 实现 引入Hot Cho ...
- Iceberg学习日记(1) 定位两个线上Iceberg查不到文件的问题
前言 Iceberg是我们去年年底(2020)开始调研,目前上线了130多张表.主要用于流量日志清洗,数据报表,推荐特征基础数据.至今为也算是积累了一些使用及定位问题经验. 这篇文章会介绍两个线上Ic ...
- Python之基本数据类型与数据结构
一.基础数据类型 标准数据类型: ·不可变数据类型 Number(数字):int.float.bool.complex(复数) String(字符串) Tuple(元祖):不可变,无法通过下标来修改值 ...
- Element Plus 正式版发布啦!🎉🎉
今天,我们非常高兴地宣布 Element Plus 稳定版正式发布.自第一个 commit 起,经过 1 年零 7 个月的持续迭代开发,总计 2635 commits,经过 256 位贡献者所提交的 ...
- 2020-9-29 T3
题意:给定一颗大小为 \(n(n \le 5 \times 10 ^ 4)\) 的树,保证树的生成方式随机,你需要选定两个点 \(x, y\),最小化: \[\sum\limits_{i = 1} ^ ...
- 羽夏闲谈—— C 的 scanf 的高级用法
前言 今天看到博友发了个有关scanf的使用的注意事项,就是讨论缓冲区残存数据的问题,用简单的代码示例复述一下: #define _CRT_SECURE_NO_WARNINGS #include ...
- netty系列之:选byte还是选message?这是一个问题
目录 简介 类型的定义 搭建UDT stream服务器 搭建UDT message服务器 Stream和Message的handler 总结 简介 UDT给了你两种选择,byte stream或者me ...
- JSP页面重定向与页面内容转发
重定向:属于两次请求+响应,客户端浏览器地址栏会改变. 转发:属于一次请求+一次响应,客户端浏览器地址栏不会改变. 重定向: response.setHeader("action" ...
- ARC快速入门
1.ARC机制判断 iOS5以后,创建项目默认的都是ARC ARC机制下有几个明显的标志: 不允许调用对象的 release方法 不允许调用 autorelease方法 再重写父类的dealloc方法 ...
- 【Github资源大汇总】 - 王朋
1.Github-iOS备忘 (国人总结的上百个Github上的开发框架和完整App) http://github.ibireme.com/github/list/ios/ 2.不少优秀的 iOS, ...