H5 embedded in the app
1. Webview generates a picture, long press the picture to save it to the phone
1. Generate pictures (canvans)
2. Press and hold the picture to save to the phone, monitor the touchstart event, and execute the method if the timer exceeds a certain time
https://www.jianshu.com/p/c336fa712da9
2. Copy the text
复制链接
// 复制链接
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. The problem of vertical centering of text
display: block
设置padding
4. The front-end routing of the problem with gestures returning to the previous page
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. Customize pictures and copywriting shared to WeChat Moments
h5 + app: H5 alone cannot call up WeChat. It requires native app to integrate WeChat SDK, app to adjust WeChat method, and h5 to adjust app method to achieve. h5 can only share links to WeChat friends and Moments, and cannot share pictures, only through the app method! ! !
h5 page sharing (not involving embedding into the app): Introduce weixin-js-sdk, first determine the browser environment, whether it is a WeChat browser, if it is a WeChat browser, you can use some custom interfaces in wx sdk to customize the copy , Pictures and other content (common browsers have their own sharing events or something)