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 相关文章推荐
document.getElementById的简写方式(获取id对象的简略写法)
Sep 10 Javascript
jQuery1.6 正式版发布并提供下载
May 05 Javascript
JQuery EasyUI 日期控件如何控制日期选择区间
May 05 Javascript
js简单实现交换Li的值
May 22 Javascript
完美兼容多浏览器的js判断图片路径代码汇总
Apr 17 Javascript
用javascript实现自动输出网页文本
Jul 30 Javascript
解决angular的post请求后SpringMVC后台接收不到参数值问题的方法
Dec 10 Javascript
详解Angular.js的$q.defer()服务异步处理
Nov 06 Javascript
JS中事件冒泡和事件捕获介绍
Dec 13 Javascript
js异步编程小技巧详解
Aug 14 Javascript
微信小程序实现团购或秒杀批量倒计时
Nov 01 Javascript
浅析webpack-bundle-analyzer在vue-cli3中的使用
Oct 23 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
PHP读取xml方法介绍
2013/01/12 PHP
简单了解WordPress开发中update_option()函数的用法
2016/01/11 PHP
微信 getAccessToken方法详解及实例
2016/11/23 PHP
php微信公众号开发之二级菜单
2018/10/20 PHP
jQuery实现渐变弹出层和弹出菜单的方法
2015/02/20 Javascript
Bootstrap学习笔记之css样式设计(1)
2016/06/07 Javascript
AngularJS基础 ng-mousemove 指令简单示例
2016/08/02 Javascript
bootstrap laydate日期组件使用详解
2017/01/04 Javascript
angularjs2 ng2 密码隐藏显示的实例代码
2017/08/01 Javascript
浅谈Vuejs中nextTick()异步更新队列源码解析
2017/12/31 Javascript
vue axios 在页面切换时中断请求方法 ajax
2018/03/05 Javascript
详解VUE单页应用骨架屏方案
2019/01/17 Javascript
JS把字符串格式的时间转换成几秒前、几分钟前、几小时前、几天前等格式
2019/07/10 Javascript
Node.js在图片模板上生成二维码图片并附带底部文字说明实现详解
2019/08/07 Javascript
微信小程序获取当前位置和城市名
2019/11/13 Javascript
详解搭建一个vue-cli的移动端H5开发模板
2020/01/17 Javascript
Python实时获取cmd的输出
2015/12/13 Python
Python基于Pymssql模块实现连接SQL Server数据库的方法详解
2017/07/20 Python
Django处理文件上传File Uploads的实例
2018/05/28 Python
Python常见的pandas用法demo示例
2019/03/16 Python
提升Python程序性能的7个习惯
2019/04/14 Python
Python爬取知乎图片代码实现解析
2019/09/17 Python
CSS3实现任意图片lowpoly动画效果实例
2017/05/11 HTML / CSS
html5使用canvas绘制太阳系效果
2014/12/15 HTML / CSS
Sperry官网:帆船鞋创始品牌
2016/09/07 全球购物
材料采购员岗位职责
2013/12/17 职场文书
应届大学生自荐书
2014/06/17 职场文书
大专生求职信
2014/06/29 职场文书
送温暖献爱心活动总结
2014/07/08 职场文书
违反纪律检讨书范文
2015/05/07 职场文书
金榜题名主持词
2015/07/02 职场文书
送给火锅店的创意营销方案!
2019/07/08 职场文书
详解MySQL的Seconds_Behind_Master
2021/05/18 MySQL
上帝为你开了一扇窗之Tkinter常用函数详解
2021/06/02 Python
MySQL数据库简介与基本操作
2022/05/30 MySQL
在python中读取和写入CSV文件详情
2022/06/28 Python