Js保存图片到本地
注:此方法是使用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保存图片到本地的更多相关文章
- 原生js 保存图片到本地
<template> <div> <!--创建一个cavas 用来存放图片--> <canvas id="cavasimg" width= ...
- JS/HTML 保存图片到本地:HTML <a> download 属性
JS如何保存图片到本地呢?自己百度一下吧! 这里想要说的是,可以利用 HTML 的 <a> 标签 来是实现保存图片到本地的功能,参考代码如下: <a href="http: ...
- js+Canvas 利用js 实现浏览器保存图片到本地
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
- HTML 保存图片到本地
具体方法有两种 一种是 利用canvas的 toDataUrl 和Html5 里面的 <a>标签里面的 Download 属性 虽然 Download 的兼容性不怎么样 但是在文章后 ...
- store.js - 轻松实现本地存储(LocalStorage)
store.js 是一个兼容所有浏览器的 LocalStorage 包装器,不需要借助 Cookie 或者 Flash.store.js 会根据浏览器自动选择使用 localStorage.globa ...
- WebView中Js与Android本地函数的相互调用
介绍 随着Html5的普及,html在表现力上不一定比原生应用差,并且有很强的扩展兼容性,所以越来越多的应用是采用Html与Android原生混合开发模式实现. 既然要实现混合开发,那么Js与Andr ...
- JS方式调用本地的可执行文件
看到一个方法,有些用,先存下来,有用的时候再用. 前几天,在IE,FIREFOX中实现了用JS方式调用本地的可执行文件.地址:www.yihaomen.com/article/js/211.htm , ...
- video.js不能控制本地视频或者音频播放时长
问题: 把视频放到本地,然后对视频进行测试,想要控制视频或者音频的播放时长,没办法做到,每次拉动进度条,都会使得本地视频重新播放 原因: 所有浏览器默认js无法访问本地地址,也就是说js不能对本地文件 ...
- java+js实现展示本地文件夹下的所有图片demo[申明:来源于网络]
java+js实现展示本地文件夹下的所有图片demo[申明:来源于网络] 地址:http://blog.csdn.net/allgis/article/details/46364875
随机推荐
- nacos-server安装、运行 (docker)
https://nacos.io/en-us/docs/quick-start-docker.htmlhttps://github.com/nacos-group/nacos-docker mkdir ...
- NGINX Cache Management (.imh nginx)
In this article, we will explore the various NGINX cache configuration options, and tips on tweaking ...
- HTTP、MQTT、Websocket、WebService区别
相同点: HTTP.MQTT.Websocket均为OSI 7层模型的[应用层协议]注意. WebService并非通信协议,而是一种远程接口调用(RPC)的框架技术. 不同点: MQTT MQTT协 ...
- postgres安装pg_buffercache扩展
1.查看是否安装了pg_buffercache postgres=# \dx List of installed extensions Name | Version | Schema | Descri ...
- EOS测试链智能合约部署调用
ETH与EOS两者智能合约进行简单的对比. 1.编译智能合约(合约编译成.wasm与.abi格式后即可部署到区块链) [root@C03-12U-26 testcontract]# cat testc ...
- db2常用操作命令
1. 打开命令行窗口 #db2cmd 2. 打开控制中心 # db2cmd db2cc 3. 打开命令编辑器 db2cmd db2ce =====操作数据库命令===== 4. 启动数据库实例 #db ...
- 170道python面试题(转)
作者:麋鹿链接:https://www.zhihu.com/question/54513391/answer/779646691来源:知乎著作权归作者所有.商业转载请联系作者获得授权,非商业转载请注明 ...
- Windows 下使用 Composer 安装 thinkphp
我用 XAMPP 安装 thinkphp 会出错,所以把环境换成了 phpStudy,这样甚至不用到处找安装包,直接去官网有最新版本,PHP 版本也是比较新的. 安装 phpStudy 先去官网下载安 ...
- Windows平台为 ElasticSearch 6.x 安装 Head 客户端插件
背景知识 ES 5.x 以上版本安装 head 需要 node 和 grunt 环境(之前的直接用plugin命令即可安装). 操作步骤 1. 安装 ElasticSearch 6.x,访问 http ...
- DS 图解归并排序
经典排序三剑客: 归并,堆排,快排. 今天,图解归并,一步步带你手撕代码~ 归并排序,是采用"分而治之"思想的一个典型应用. 分治法精髓: 1.分 --- 将问题分解成若干个规模更 ...