我有一个 React 项目 - 我正在附加一个onClick
滚动到页面上特定元素的标题导航链接。我正在生成 React refs,并使用元素的 Y 位置输入到Window.scrollTo()
函数调用。
这是代码:
class Component extends React.Component {
constructor(props) {
this.menuRef = React.createRef()
}
scrollToRef(ref, instructions, event, arg2) {
if (event) event.preventDefault()
let pageOffSet = 200
if (this.state.topOfPage) {
pageOffSet = 200
} else if (!this.state.topOfPage) {
pageOffSet = 150
}
window.scrollTo({top: (ref.current.offsetTop - pageOffSet), behavior: "smooth"})
}
render(){return(
// Pseudocode...
<button onClick={() => this.scrollToRef(this.menunRef, "contact", event)}
<div ref={this.menuRef}/>
)}
}
Expected Behavior:
Window scrolls down to ref Y coordinates, react state changes according to "instructions" recieved by function (I omitted setState calls)
Actual Behavior:
Working in most browsers.
In default Android browser, I get the following error:
Github 上的组件完整代码:https://github.com/Mikhail-MM/wsd-dental/blob/master/src/components/TabletSite.js https://github.com/Mikhail-MM/wsd-dental/blob/master/src/components/TabletSite.js
工作演示:https://worldsmilesdental.herokuapp.com/ https://worldsmilesdental.herokuapp.com/
请帮忙,我正试图调试这个。我不知道如何调试移动浏览器,我怎样才能看到输出console.log()
在移动 Safari 或 Android 浏览器上?