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 面向对象编程  function是方法(函数)
Sep 17 Javascript
firefox firebug中文入门教程 脚本之家新年特别版
Jan 02 Javascript
JS 显示当前日期与时间的代码
Mar 24 Javascript
js 异步处理进度条
Apr 01 Javascript
jQuery实现动画效果的简单实例
Jan 27 Javascript
js创建表单元素并使用submit进行提交
Aug 14 Javascript
jquery+css3实现网页背景花瓣随机飘落特效
Aug 17 Javascript
Bootstrap模仿起筷首页效果
May 09 Javascript
JS导出PDF插件的方法(支持中文、图片使用路径)
Jul 12 Javascript
js原生代码实现轮播图的实例讲解
Jul 28 Javascript
微信小程序实战篇之购物车的实现代码示例
Nov 30 Javascript
vue.js中ref及$refs的使用方法解析
Oct 08 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
WINDOWS 2000下使用ISAPI方式安装PHP
2006/09/05 PHP
用PHP调用数据库的存贮过程
2006/10/09 PHP
PHP在同一域名下两个不同的项目做独立登录机制详解
2017/09/22 PHP
laravel5.1框架model类查询的实现方法
2019/10/08 PHP
Laravel Reponse响应客户端示例详解
2020/09/03 PHP
js禁止页面使用右键(简单示例代码)
2013/11/13 Javascript
js正则表达exec与match的区别说明
2014/01/29 Javascript
HTML页面弹出居中可拖拽的自定义窗口层
2014/05/07 Javascript
使用jquery解析XML的方法
2014/09/05 Javascript
JavaScript中的console.assert()函数介绍
2014/12/29 Javascript
jQuery实现鼠标选文字发新浪微博的方法
2016/04/02 Javascript
AngularJS 入门教程之HTML DOM实例详解
2016/07/28 Javascript
javascript 中的事件委托详解
2016/10/25 Javascript
简单实现Bootstrap标签页
2020/08/09 Javascript
bootstrap 模态框(modal)实现水平垂直居中显示
2017/01/23 Javascript
简单的vue-resourse获取json并应用到模板示例
2017/02/10 Javascript
Vue.js实现一个漂亮、灵活、可复用的提示组件示例
2017/03/17 Javascript
原生JS 购物车及购物页面的cookie使用方法
2017/08/21 Javascript
Element-ui自定义table表头、修改列标题样式、添加tooltip、:render-header使用
2019/04/11 Javascript
three.js利用gpu选取物体并计算交点位置的方法示例
2019/11/25 Javascript
纯js+css实现仿移动端淘宝网站的弹出详情框功能
2019/12/29 Javascript
[02:17]TI4西雅图DOTA2前线报道 啸天mik夫妻档解说
2014/07/08 DOTA
python获取一组数据里最大值max函数用法实例
2015/05/26 Python
python使用matplotlib绘制柱状图教程
2017/02/08 Python
使用python实现knn算法
2017/12/20 Python
修改默认的pip版本为对应python2.7的方法
2018/11/06 Python
python实现两个文件夹的同步
2019/08/29 Python
Python单元测试及unittest框架用法实例解析
2020/07/09 Python
Servlet如何得到服务器的信息
2015/12/22 面试题
人事助理自荐信
2014/02/02 职场文书
文体活动实施方案
2014/03/27 职场文书
幼儿园中班开学寄语
2014/04/03 职场文书
员工三分钟演讲稿
2014/08/19 职场文书
大学生见习报告范文
2014/11/03 职场文书
2014年妇幼保健工作总结
2014/12/08 职场文书
《穷人》教学反思
2016/02/19 职场文书