广告
返回顶部
首页 > 资讯 > 精选 >vue引用public的js文件
  • 247
分享到

vue引用public的js文件

2024-04-02 19:04:59 247人浏览 薄情痞子
摘要

Vue引用public中js文件的方法:1.首先在项目中创建一个公共(public)的js文件;2.在main.js中使用import命令函数引入公共js并注册;3.通过this方法调用js文件即可。具体操作步骤:创建公共JS(utils.

Vue引用public中js文件的方法:1.首先在项目中创建一个公共(public)的js文件;2.在main.js中使用import命令函数引入公共js并注册;3.通过this方法调用js文件即可。

vue引用public的js文件

具体操作步骤:

创建公共JS(utils.js)  src/common/utils.js

export default {

    text(){

        console.log("测试,测试!!!")

    }

}

在main.js中引入公共js并注册

import Utils from './common/utils.js';

Vue.prototype.utils=Utils;

调用公共方法

this.utils.text();

相关操作示例:

一个一个方法注册:

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();

}

在main.js中引入并注册

import Utils from './common/utils.js';

Vue.prototype.$encrypt=encrypt;

Vue.prototype.$decrypt=decrypt;

调用

this.$encrypt("欢迎登录","siR6WLQ9pPE0738Y");

var aa=this.$encrypt("欢迎登录","siR6WLQ9pPE0738Y");

this.$decrypt(aa,"siR6WLQ9pPE0738Y");

--结束END--

本文标题: vue引用public的js文件

本文链接: https://www.lsjlt.com/news/111142.html(转载时请注明来源链接)

有问题或投稿请发送至: 邮箱/279061341@qq.com    QQ/279061341

本篇文章演示代码以及资料文档资料下载

下载Word文档到电脑,方便收藏和打印~

下载Word文档
猜你喜欢
  • vue引用public的js文件
    vue引用public中js文件的方法:1.首先在项目中创建一个公共(public)的js文件;2.在main.js中使用import命令函数引入公共js并注册;3.通过this方法调用js文件即可。具体操作步骤:创建公共JS(utils....
    99+
    2022-10-15
  • Vue如何引用public中的js文件
    目录如何引用public中的js文件vue引用公共js步骤如何引用public中的js文件 在public文件夹下创建config.js文件。 config.js中可以使用变量,也可...
    99+
    2022-11-13
  • vue项目的html如何引进public里面的js文件
    目录vue html引进public里面的js文件vue引入静态JS文件(爬坑)总结vue html引进public里面的js文件 首先在public文件夹添加js文件夹,再在js文...
    99+
    2022-12-08
    vue项目的html public里的js文件 html引进public的js
  • vue引用public目录下文件的方式详解
    有时候我们在开发h5时候,会有需要绑卡授权操作,这个时候需要同意某些协议并且这些协议是可以点击打开的,这种该怎么做呢?其实这就是一个链接,前端能够打开链接并且常用的也就是a标签喝vu...
    99+
    2022-11-13
    vue public目录 vue的public文件夹 vue引用public的js文件
  • vue打包引用的js文件丢失
    在使用 vue 打包工具时,有时我们会遇到引用的 js 文件丢失的问题。这个问题会导致整个应用程序无法正常运行,给开发人员带来不小的困扰和麻烦。本文将就此问题进行深入分析,并提供一些有效的解决方案,以帮助开发人员快速解决该问题。一、问题原因...
    99+
    2023-05-24
  • vue引用外部JS并调用JS文件中的方法实例
    目录VUE项目中引入JS文件的几种方法1.在index.html页面使用script标签引入2.在main.js中使用window.moduleName 使用3.手动添加export...
    99+
    2023-02-27
    vue引用外部js文件 vuecli引入外部js
  • vue如何引用外部JS并调用JS文件中的方法
    这篇“vue如何引用外部JS并调用JS文件中的方法”文章的知识点大部分人都不太理解,所以小编给大家总结了以下内容,内容详细,步骤清晰,具有一定的借鉴价值,希望大家阅读完这篇文章能有所收获,下面我们一起来看看这篇“vue如何引用外部JS并调用...
    99+
    2023-07-05
  • vue项目之index.html如何引入JS文件
    目录vue index.html引入JS文件注意路径的写法index.html引入js文件失效的解决解决办法总结vue index.html引入JS文件 注意路径的写法 <!D...
    99+
    2022-12-08
    vue index.html index.html引入JS文件 vue引入JS文件
  • VUE项目中引入JS文件的方法总结
    目录1.在index.html页面使用script标签引入2.在main.js中使用window.moduleName 使用3.手动添加export4. 使用import方式,把需要...
    99+
    2022-11-13
  • vue在.js文件中引入store和router问题
    目录在.js文件中引入store和router在js文件中使用vue的router和store总结在.js文件中引入store和router 在js文件中使用vue的router和...
    99+
    2023-03-06
    vue引入store vue引入router vue引入store和router
  • vue在.js文件中怎么引入store和router
    本文小编为大家详细介绍“vue在.js文件中怎么引入store和router”,内容详细,步骤清晰,细节处理妥当,希望这篇“vue在.js文件中怎么引入store和router”文章能帮助大家解决疑惑,下面跟着小编的思路慢慢深入,一起来学习...
    99+
    2023-07-05
  • vue全局引用公共的组件以及公共的JS文件问题
    目录全局引用公共的组件及公共的JS文件全局引入自定义组件问题全局引用公共的组件及公共的JS文件 1. 创建一个公共的目录 timeline ,里面包含 timeline.js 和 t...
    99+
    2022-11-13
  • uniapp如何引入js文件
    随着Uniapp的不断发展壮大,越来越多的开发者开始使用它来开发跨平台应用程序。在开发过程中,有时可能需要引入一些自己编写的js文件。本文将介绍使用Uniapp如何引入js文件的方法。一、在页面中引入js文件在pages目录下找到需要引入j...
    99+
    2023-05-21
  • HTML如何引入js文件
    这篇文章主要为大家展示了“HTML如何引入js文件”,内容简而易懂,条理清晰,希望能够帮助大家解决疑惑,下面让小编带领大家一起研究并学习一下“HTML如何引入js文件”这篇文章吧。 script标签元素既...
    99+
    2022-10-19
  • JSP如何引入JS文件
    这篇文章主要讲解了“JSP如何引入JS文件”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“JSP如何引入JS文件”吧!1.在eclipse中新建一个web项目...
    99+
    2022-10-19
  • html怎么引入js文件
    这篇文章将为大家详细讲解有关html怎么引入js文件,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。方法:1、在script标签内直接写入javaccript代码;2、通过“<script src=&...
    99+
    2023-06-14
  • js和css文件如何引入
    小编给大家分享一下js和css文件如何引入,希望大家阅读完这篇文章之后都有所收获,下面让我们一起去探讨吧! 外部样式表 当样式需要应用于很多页面时,外部样式表将是理想的选择。在使用外部样式表的情况下,你...
    99+
    2022-10-19
  • react中如何引入js文件
    这篇文章给大家分享的是有关react中如何引入js文件的内容。小编觉得挺实用的,因此分享给大家做个参考,一起跟随小编过来看看吧。   导入jquery-2.1.4.min.js会在MyEclipse中报告...
    99+
    2022-10-19
  • Vue-i18n 在 JS 文件中的使用方法
    这篇文章主要介绍“Vue-i18n 在 JS 文件中的使用方法”,在日常操作中,相信很多人在Vue-i18n 在 JS 文件中的使用方法问题上存在疑惑,小编查阅了各式资料,整理出简单好用的操作方法,希望对大...
    99+
    2022-10-19
  • vue如何引用外部JS
    这篇文章给大家分享的是有关vue如何引用外部JS的内容。小编觉得挺实用的,因此分享给大家做个参考,一起跟随小编过来看看吧。第一种 如果库是es6写的 就可以用import 引入比如我自己写的http 封装接...
    99+
    2022-10-19
软考高级职称资格查询
编程网,编程工程师的家园,是目前国内优秀的开源技术社区之一,形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容,为IT开发者提供了一个发现、使用、并交流开源技术的平台。
  • 官方手机版

  • 微信公众号

  • 商务合作