注:此方法是使用hbuilderx云打包之后才能用,否则在浏览器中会报 plus is not defined

官方文档 http://www.html5plus.org/doc/zh_cn/gallery.html#plus.gallery.save

  http://www.html5plus.org/doc/zh_cn/nativeobj.html#plus.nativeObj.BitmapSaveOptions

<template>
<button @click="saveBitmap()">保存</button>
</template> <script>
export default {
data(){
return{
wc:'',
bitmap:''
}
},
mounted(){
// H5 plus事件处理
function plusReady(){
// 获取首页Webview窗口
this.wc = plus.webview.currentWebview();
// 创建Bitmap对象
this.bitmap = new plus.nativeObj.Bitmap("test");
// 将webview内容绘制到Bitmap对象中
this.wc.draw(this.bitmap,function(){
console.log('绘制图片成功');
},function(e){
console.log('绘制图片失败:'+JSON.stringify(e));
});
}
if(window.plus){
plusReady();
}else{
document.addEventListener("plusready",plusReady,false);
}
},
methods:{
saveBitmap(){
// 获取指定标识的Bitmap图片对象
this.bitmap = plus.nativeObj.Bitmap.getBitmapById('test');
// 保存图片到Bitmap对象中
this.bitmap.save( "_doc/a.jpg",{},function(i){
// 保存文件到系统相册中
//i.target文件路径
plus.gallery.save( i.target, function () {
alert( "保存图片到相册成功" );
});
this.bitmap.clear();//销毁Bitmap图片
this.bitmap.recycle();//回收图片内存
}
,function(e){
console.log('保存图片失败:'+JSON.stringify(e));
this.bitmap.clear();//销毁Bitmap图片
this.bitmap.recycle();//回收图片内存
});
}
}
}
</script>

Js保存图片到本地的更多相关文章

  1. 原生js 保存图片到本地

    <template> <div> <!--创建一个cavas 用来存放图片--> <canvas id="cavasimg" width= ...

  2. JS/HTML 保存图片到本地:HTML <a> download 属性

    JS如何保存图片到本地呢?自己百度一下吧! 这里想要说的是,可以利用 HTML 的 <a> 标签 来是实现保存图片到本地的功能,参考代码如下: <a href="http: ...

  3. js+Canvas 利用js 实现浏览器保存图片到本地

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  4. HTML 保存图片到本地

    具体方法有两种  一种是 利用canvas的 toDataUrl  和Html5 里面的 <a>标签里面的 Download 属性 虽然 Download 的兼容性不怎么样  但是在文章后 ...

  5. store.js - 轻松实现本地存储(LocalStorage)

    store.js 是一个兼容所有浏览器的 LocalStorage 包装器,不需要借助 Cookie 或者 Flash.store.js 会根据浏览器自动选择使用 localStorage.globa ...

  6. WebView中Js与Android本地函数的相互调用

    介绍 随着Html5的普及,html在表现力上不一定比原生应用差,并且有很强的扩展兼容性,所以越来越多的应用是采用Html与Android原生混合开发模式实现. 既然要实现混合开发,那么Js与Andr ...

  7. JS方式调用本地的可执行文件

    看到一个方法,有些用,先存下来,有用的时候再用. 前几天,在IE,FIREFOX中实现了用JS方式调用本地的可执行文件.地址:www.yihaomen.com/article/js/211.htm , ...

  8. video.js不能控制本地视频或者音频播放时长

    问题: 把视频放到本地,然后对视频进行测试,想要控制视频或者音频的播放时长,没办法做到,每次拉动进度条,都会使得本地视频重新播放 原因: 所有浏览器默认js无法访问本地地址,也就是说js不能对本地文件 ...

  9. java+js实现展示本地文件夹下的所有图片demo[申明:来源于网络]

    java+js实现展示本地文件夹下的所有图片demo[申明:来源于网络] 地址:http://blog.csdn.net/allgis/article/details/46364875

随机推荐

  1. nacos-server安装、运行 (docker)

    https://nacos.io/en-us/docs/quick-start-docker.htmlhttps://github.com/nacos-group/nacos-docker mkdir ...

  2. NGINX Cache Management (.imh nginx)

    In this article, we will explore the various NGINX cache configuration options, and tips on tweaking ...

  3. HTTP、MQTT、Websocket、WebService区别

    相同点: HTTP.MQTT.Websocket均为OSI 7层模型的[应用层协议]注意. WebService并非通信协议,而是一种远程接口调用(RPC)的框架技术. 不同点: MQTT MQTT协 ...

  4. postgres安装pg_buffercache扩展

    1.查看是否安装了pg_buffercache postgres=# \dx List of installed extensions Name | Version | Schema | Descri ...

  5. EOS测试链智能合约部署调用

    ETH与EOS两者智能合约进行简单的对比. 1.编译智能合约(合约编译成.wasm与.abi格式后即可部署到区块链) [root@C03-12U-26 testcontract]# cat testc ...

  6. db2常用操作命令

    1. 打开命令行窗口 #db2cmd 2. 打开控制中心 # db2cmd db2cc 3. 打开命令编辑器 db2cmd db2ce =====操作数据库命令===== 4. 启动数据库实例 #db ...

  7. 170道python面试题(转)

    作者:麋鹿链接:https://www.zhihu.com/question/54513391/answer/779646691来源:知乎著作权归作者所有.商业转载请联系作者获得授权,非商业转载请注明 ...

  8. Windows 下使用 Composer 安装 thinkphp

    我用 XAMPP 安装 thinkphp 会出错,所以把环境换成了 phpStudy,这样甚至不用到处找安装包,直接去官网有最新版本,PHP 版本也是比较新的. 安装 phpStudy 先去官网下载安 ...

  9. Windows平台为 ElasticSearch 6.x 安装 Head 客户端插件

    背景知识 ES 5.x 以上版本安装 head 需要 node 和 grunt 环境(之前的直接用plugin命令即可安装). 操作步骤 1. 安装 ElasticSearch 6.x,访问 http ...

  10. DS 图解归并排序

    经典排序三剑客: 归并,堆排,快排. 今天,图解归并,一步步带你手撕代码~ 归并排序,是采用"分而治之"思想的一个典型应用. 分治法精髓: 1.分 --- 将问题分解成若干个规模更 ...