在 Android 移动浏览器上调用 Window.scrollTo() 会导致 TypeError: 未找到与提供的签名匹配的函数

2024-04-11

我有一个 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: enter image description here

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 浏览器上?


这是一个新的签名scrollTo,以前只接受scrollTo( x, y )但现在它也可以接受一个对象。 android浏览器一定不知道新版本。您可以使用polyfill https://github.com/iamdustan/smoothscroll来修补它。

如果您有 Mac,则可以通过桌面 Safari 调试 iOS Safari:https://appletoolbox.com/2014/05/use-web-inspector-debug-mobile-safari/ https://appletoolbox.com/2014/05/use-web-inspector-debug-mobile-safari/

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

在 Android 移动浏览器上调用 Window.scrollTo() 会导致 TypeError: 未找到与提供的签名匹配的函数 的相关文章

随机推荐