vue解决ios端键盘收起后事件失效问题

1、创建directive.js2、在main.js全局引入3、用到input就加一句v-blur <input v-blur />// 自定义指令v-blur，解决ios端键盘收起后事件失效问题Vue.directive('blur', {inserted(el) {// 监听键盘收起事件document.body.addEventListener('focusout', () =&

472509985

1270人浏览 · 2020-05-29 17:16:01

472509985 · 2020-05-29 17:16:01 发布

1、创建directive.js
2、在main.js全局引入
3、用到input就加一句v-blur <input v-blur />

// 自定义指令v-blur，解决ios端键盘收起后事件失效问题
Vue.directive('blur', {
	inserted(el) {
		// 监听键盘收起事件
		document.body.addEventListener('focusout', () => {
			if (/(iPhone|iPad|iPod|iOS)/i.test(navigator.userAgent)) {
				setTimeout(() => {
					const scrollHeight = document.documentElement.scrollTop || document.body.scrollTop || 0
					window.scrollTo(0, Math.max(scrollHeight - 1, 0))
				}, 100)
			}
		})
	}
})