search

IronPans / bee-mobile

UI Components for React.
https://tiny-component.github.io
MIT License
165 stars 29 forks source link

建议: picker显示时禁止滚动 #3

Closed mimittqq closed 6 years ago

mimittqq commented 6 years ago

否则使用picker时如果底层带滚动条, 拖动会引起底层的滚动而使picker无法拖动选择

(当然这个使用插件的人自己做也可以

mimittqq commented 6 years ago

我简单的写了下 目前测试了安卓ios都可以(不是所有版本 只是我手头上的两台)

const body = document.body; const html = document.documentElement; let scroll_top = undefined; const prevent_default = (e) => { e.preventDefault(); };

onOpen scroll_top = window.scrollY; const scroll_left = window.scrollX; body.style.top = -${scroll_top}px; body.className += 'noScroll'; html.className += 'noScroll'; body.addEventListener( 'touchmove', prevent_default, {passive: false});

onClose body.className = body.className.replace(/\snoScroll/, ''); html.className = body.className.replace(/\snoScroll/, ''); window.scrollTo(0, scroll_top); body.removeEventListener( 'touchmove', prevent_default);

css: //这里写在attribute上比较好 用class只是我懒得记录状态而已. .noScroll { overflow-y: hidden; position: fixed; }

IronPans commented 6 years ago

@mimittqq 已记录修改，谢谢