内嵌在app中的h5
1、webview 生成图片,长按图片保存到手机
1、生成图片(canvans)
2、图片长按保存到手机,监听 touchstart事件,定时器超过一定时间执行方法
https://www.jianshu.com/p/c336fa712da9
2、复制文本
复制链接
// 复制链接
copyUrl() {
let textarea = document.createElement('textarea');
textarea.id = 'copyTextarea';
textarea.style.width = 0;
textarea.style.height = 0;
document.body.appendChild(textarea);
let textarea2 = document.getElementById('copyTextarea');
textarea2.innerHTML = this.urlCopy;
if (navigator.userAgent.match(/(iPhone|iPod|iPad);?/i)) {
const range = document.createRange();
range.selectNode(document.getElementById('copyTextarea'));
const selection = window.getSelection();
if (selection.rangeCount > 0) selection.removeAllRanges();
selection.addRange(range);
} else {
// 选中文本(select()方法对IOS部分版本无效)
textarea.select();
}
document.execCommand('copy');
document.body.removeChild(textarea);
this.cancel();
this.$showToast('复制成功');
},
3、文字垂直居中问题
display: block
设置padding
4、手势返回上一页的问题
前端路由
mounted:
this.pushHistory();
window.addEventListener('popstate', this.jiantng, false);
destory:
window.removeEventListener('popstate', this.jiantng);
jiantng(e) {
console.log('123');
// window.history.back();
},
pushHistory() {
var state = {
title: 'title',
url: '#'
};
window.history.pushState(state, 'title', '#');
},
5、自定义分享到微信朋友圈的图片和文案
h5 + app:单独的h5是唤不起微信的,需要原生app去集成微信的sdk,app去调微信的方法,h5再去调app的方法,才可以实现。h5只能分享链接到微信好友和朋友圈,不能分享图片,只能通过app方法获取!!!
h5页面分享(不涉及内嵌到app中): 引入weixin-js-sdk 先判断浏览器环境,是不是微信浏览器,是微信浏览器的话可以使用wx sdk里面的一些自定义接口,自定义文案,图片等内容 (普通浏览器有自己的分享事件啥的)