在vue项目中使用md5加密的方法
npm安装:
npm install --save js-md5
1.在需要使用的项目文件中引入:
import md5 from 'js-md5';
使用:
md5('hello world') // 5eb63bbbe01eeed093cb22bb8f5acdc3
2.或者在main.js文件中将md5转换成vue原型:
import md5 from 'js-md5'; Vue.prototype.$md5 = md5;
使用:
this.$md5('hello world') // 5eb63bbbe01eeed093cb22bb8f5acdc3
vue使用md5加密的实例代码
import crypto from 'crypto' export default { name: 'HelloWorld', data () { return { msg: 'Welcome to Your Vue.js App' } }, mounted(){ this.getmd5("aaa"); }, methods:{ getmd5(str){ var a; var md5 = crypto.createHash("md5"); //update("中文", "utf8") md5.update(str); var a = md5.digest('hex'); console.log(a); //47bce5c74f589f4867dbd57e9ca9f808 return a; } } }
总结
以上所述是小编给大家介绍的在vue项目中使用md5加密的方法,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对我们网站的支持!
相关推荐
-
vue.js使用3DES加密的方法示例
本文实例讲述了vue.js使用3DES加密的方法.分享给大家供大家参考,具体如下: 如何在VUE-CLI手脚架建立的工程中使用3des加密: npm install crypto-js --save-dev import CryptoJS from 'crypto-js' //DES加密 Pkcs7填充方式 encryptByDES(message, key){ const keyHex = CryptoJS.enc.Utf8.parse(key); const encrypted = Cryp
-
在vue项目中使用md5加密的方法
npm安装: npm install --save js-md5 1.在需要使用的项目文件中引入: import md5 from 'js-md5'; 使用: md5('hello world') // 5eb63bbbe01eeed093cb22bb8f5acdc3 2.或者在main.js文件中将md5转换成vue原型: import md5 from 'js-md5'; Vue.prototype.$md5 = md5; 使用: this.$md5('hello world') // 5
-
如何在vuejs项目中使用md5加密密码的实现
目录 1.NPM 安装: 2.全局用法 3.局部用法 概念 MD5加密有什么用?为什么要使用MD5加密? MD5算法的用途是什么? 具体使用步骤: 1.NPM 安装: npm install --save js-md5 2.全局用法 2.1.全局引用 import md5 from 'js-md5'; Vue.prototype.$md5 = md5; 2.2.全局使用 将您需要加密的信息放进去: this.$md5('This is encrypted content') // 6f43dd5
-
在vue项目中引入highcharts图表的方法(详解)
npm进行highchars的导入,导入完成后就可以进行highchars的可视化组件开发了 npm install highcharts --save 1.components目录下新建一个chart.vue组件 <template> <div class="x-bar"> <div :id="id" :option="option"></div> </div> </templa
-
在vue项目中使用sass的配置方法
1.创建一个基于 webpack 模板的新项目 $ vue init webpack myvue 2.在当前目录下,安装依赖 $ cd myvue $ npm install 3.安装sass的依赖包 npm install --save-dev sass-loader //sass-loader依赖于node-sass npm install --save-dev node-sass 4.在build文件夹下的webpack.base.conf.js的rules里面添加配置 { test: /
-
vue项目中使用百度地图的方法
1.在百度地图申请密钥: http://lbsyun.baidu.com/ 将 <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=密钥" ></script> 中的 密钥替换成你申请的,在 vue项目的index.html引用. 2. 在build 文件下下的 webpack.base.conf.js贴入代码 externals: {
-
在vue项目中正确使用iconfont的方法
1.打开 iconFont官网 选择自己喜欢的图标,并且添加购物车 2.点击购物车,添加至项目 3.下载至本地 4.把我们下载好的文件iconfont.css和iconfont.ttf放到项目assets文件夹下(可创建一个css文件或iconfont文件) 5.在main.js中引入iconfont.css样式 import './assets/iconfont/iconfont.css' 6.在在vue文件中引用<i class="iconfont icon-zitigui-xianx
-
vue项目中使用骨架屏的方法
现在的应用开发,基本上都是前后端分离的,前端主流框架有SPA.MPA等,那么解决页面渲染.白屏时间成为首要关注的点 webpack可以按需加载,减小首屏需要加载代码的体积: 使用CDN技术.静态代码等缓存技术,可以减小加载渲染的时长 问题:但是首页依然存在加载.渲染等待时长的问题.那么如何从视觉效果上减小首屏白屏的时间呢? 骨架屏:举个例子:其实就是在模版文件中id=app容器下面写想要展示的效果,在new Vue(option)之后,该id下的内容就被替换了( 这时候,可能Vue编译生成的内容
-
教你在vue项目中使用svg图标的方法
svg图标优点 svg与iconfont之类的字体图标在网页中的使用差别不大,可以修改大小,颜色等而且不失真. 安装svg-sprite-loader npm install --save-dev svg-sprite-loader 文件夹目录 (xxx.svg 注意:这里的 xxx 不要使用中文) - assets -- icon --- svg --- index.js 配置依赖 // Vue2.x 在 webpack.base.conf.js 中配置如下: // 注意svg图标的路径 sr
-
在vue项目中安装使用Mint-UI的方法
一.Mint UI 是 由饿了么前端团队推出的 一个基于 Vue.js 的移动端组件库,具有以下特性: 使用文档: http://mint-ui.github.io/#!/zh-cn Mint UI 包含丰富的 CSS 和 JS 组件,能够满足日常的移动端开发需要.通过它,可以快速构建出风格统一的页面,提升开发效率. 真正意义上的按需加载组件.可以只加载声明过的组件及其样式文件,无需再纠结文件体积过大. 考虑到移动端的性能门槛,Mint UI 采用 CSS3 处理各种动效,避免浏览器进行不必要的
-
vue项目中导入swiper插件的方法
版本选择 swiper是个常用的插件,现在已经迭代到了第四代:swiper4. 常用的版本是swiper3和swiper4,我选择的是swiper3. 安装 安装swiper3的最新版本3.4.2: npm i swiper@3.4.2 -S 这里一个小知识,查看node包的所有版本号的方法: npm view 包名 versions 组件编写 swiper官方的使用方法分为4个流程: 加载插件 HTML内容 给Swiper定义一个大小 初始化Swiper 我也按照这个流程编写组件: 加载插件
随机推荐
- AngularJS下对数组的对比分析
- Javascript校验密码复杂度的正则表达式
- IP 正则表达式验证
- 谈谈Ajax原理实现过程
- Windows Powershell使用管道
- CCTV英语专用语
- Python编程中使用Pillow来处理图像的基础教程
- JavaScript编写检测用户所使用的浏览器的代码示例
- 计数器详细设计
- 如何用Jsp读取Mysql数据库
- typedef_struct与struct之间的区别
- 像table一样布局div
- 鼠标滑上去后图片放大浮出效果的js代码
- Kotlin 基本语法实例详解
- Python程序中设置HTTP代理
- jquery弹出框的用法示例(2)
- Java递归算法的使用分析
- Android开发系列二之窗口Activity的生命周期
- Spring Boot基础学习之Mybatis操作中使用Redis做缓存详解
- Spring中基于Java的配置@Configuration和@Bean用法详解