vue 使用外部JS与调用原生API操作示例


Posted in Javascript onDecember 02, 2019

本文实例讲述了vue 使用外部JS与调用原生API操作。分享给大家供大家参考,具体如下:

vue 使用外部JS

概要

在开发时我们会经常需要使用到外部的JS,这样我们需要引入外部js,然后进行使用。

实现方法

我们在开发的过程中需要使用到 sha256 将用户的密码进行加密传输。

我们对js进行一点点改造。

function sha256_digest(data) {
  sha256_init();
  sha256_update(data, data.length);
  sha256_final();
    return sha256_encode_hex();
}
export {sha256_digest}

像这个代码,我们需要加一行代码,将这个js方法导出。

export {sha256_digest}

在使用的时候我们引入JS.

import { sha256_digest } from "@/assets/sha256.js"

我们可以导入一个或者多个方法,这里导入了一个方法。

这样在代码中使用就好了

sha256_digest(this.user.password)

调用原生API

概要

我们在开发手机端程序的时候了,我们经常需要使用到拍照,二维码的功能.数字天堂公司提供了大量的原生API支持。

http://www.html5plus.org/doc/

实现

1.在hbuilder 选择需要使用的模块

vue 使用外部JS与调用原生API操作示例

2.在组件代码中调用相应的API接口。

比如拍照:

takePhoto(){
      var _self=this;
      var cmr = plus.camera.getCamera();
      var fmt = cmr.supportedImageFormats[0];
      cmr.captureImage( function( path ){
        plus.io.resolveLocalFileSystemURL(path, function(entry) {
            var tmpPath= entry.toLocalURL();
            var fileAry=[];
            fileAry.push(tmpPath);
            _self.compressImg(fileAry);
        })
       },
       function( error ) {},
       {format:fmt});
     }

plus 就是H5+ 的接口调用。

注意事项

我们在使用这些接口的时候,需要将系统打包成app,否则plus 不能使用。

希望本文所述对大家vue.js程序设计有所帮助。

Javascript 相关文章推荐
javascript 写的一个简单的timer
Jul 30 Javascript
node.js Web应用框架Express入门指南
May 28 Javascript
jquery、js调用iframe父窗口与子窗口元素的方法整理
Jul 31 Javascript
jQuery时间插件jquery.clock.js用法实例(5个示例)
Jan 14 Javascript
AngularJs学习第八篇 过滤器filter创建
Jun 08 Javascript
jQuery弹出层后禁用底部滚动条(移动端关闭回到原位置)
Aug 29 Javascript
在html中引入外部js文件,并调用带参函数的方法
Oct 31 Javascript
JS html时钟制作代码分享
Mar 03 Javascript
浅谈通过JS拦截 pushState和replaceState事件
Jul 21 Javascript
页面内锚点定位及跳转方法总结(推荐)
Apr 24 Javascript
基于js实现复制内容到操作系统粘贴板过程解析
Oct 11 Javascript
小程序实现上下切换位置
Nov 16 Javascript
node使用mysql获取数据库数据中文乱码问题的解决
Dec 02 #Javascript
vue中上传视频或图片或图片和文字一起到后端的解决方法
Dec 01 #Javascript
angular8和ngrx8结合使用的步骤介绍
Dec 01 #Javascript
angular异步验证防抖踩坑实录
Dec 01 #Javascript
如何利用node.js开发一个生成逐帧动画的小工具
Dec 01 #Javascript
Node.js中console.log()输出彩色字体的方法示例
Dec 01 #Javascript
Node.js控制台彩色输出的方法与原理实例详解
Dec 01 #Javascript
You might like
解析web文件操作常见安全漏洞(目录、文件名检测漏洞)
2013/06/29 PHP
利用php抓取蜘蛛爬虫痕迹的示例代码
2016/09/30 PHP
PHP模拟http请求的方法详解
2016/11/09 PHP
JQuery操作表格(隔行着色,高亮显示,筛选数据)
2012/02/23 Javascript
js中eval详解
2012/03/30 Javascript
JS控件ASP.NET的treeview控件全选或者取消(示例代码)
2013/12/16 Javascript
JavaScript+CSS控制打印格式示例介绍
2014/01/07 Javascript
javascript面向对象之共享成员属性与方法及prototype关键字用法
2015/01/13 Javascript
在JavaScript的正则表达式中使用exec()方法
2015/06/16 Javascript
JavaScript人脸识别技术及脸部识别JavaScript类库Tracking.js
2015/09/14 Javascript
jQuery实现图片轮播效果代码
2016/09/27 Javascript
Bootstrap分页插件之Bootstrap Paginator实例详解
2016/10/15 Javascript
js中的触发事件对象event.srcElement与event.target详解
2017/03/15 Javascript
vue2 前后端分离项目ajax跨域session问题解决方法
2017/04/27 Javascript
详解如何使用PM2将Node.js的集群变得更加容易
2017/11/15 Javascript
Javascript实现运算符重载详解
2018/04/07 Javascript
微信小程序之判断页面滚动方向的示例代码
2018/08/30 Javascript
vue使用swiper.js重叠轮播组建样式
2019/11/14 Javascript
Nuxt默认模板、默认布局和自定义错误页面的实现
2020/05/11 Javascript
Python实例分享:快速查找出被挂马的文件
2014/06/08 Python
python迭代器与生成器详解
2016/03/10 Python
对Python中range()函数和list的比较
2018/04/19 Python
python使用thrift教程的方法示例
2019/03/21 Python
提升Python程序性能的7个习惯
2019/04/14 Python
python3中的logging记录日志实现过程及封装成类的操作
2020/05/12 Python
python代码区分大小写吗
2020/06/17 Python
python中random.randint和random.randrange的区别详解
2020/09/20 Python
matplotlib相关系统目录获取方式小结
2021/02/03 Python
CSS3中几个新增加的盒模型属性使用教程
2016/03/01 HTML / CSS
css3的动画特效之动画序列(animation)
2017/12/22 HTML / CSS
捷克浴室和厨房设备购物网站:SIKO
2018/08/11 全球购物
英国老牌潮鞋店:Offspring
2019/08/19 全球购物
社区十八大感言
2014/01/19 职场文书
数学教研活动总结
2014/07/02 职场文书
保安辞职申请书应该怎么写?
2019/07/15 职场文书
Windows下载并安装MySQL8.0.x 版本的完整教程
2022/04/10 MySQL