window.enableMouseFlow在componentDidMount()中未定义,但在render()中可用

问题描述 投票:0回答:2

嗨,我有这段代码

    export class CompanyAccountsList extends Component {
        constructor(props) {
            super(props);
        }

        getChildContext() {
            return { prefix: 'company_accounting' };
        }

        componentDidMount() {
            //getting window.enableMouseFlow in this console
            console.log(window);

            //can't get window.enableMouseFlow in this console
            console.log(window.enableMouseFlow);

            if (window.enableMouseFlow) {
                //This codes are never executing as the condition is undefined
                enableMouseFlow();
                setMouseFlowTag('new_company_accounting');
            }
        }

        render() {
    //Rendering codes are here
    }

在初始加载页面时,我得到结果为

Window {postMessage: ƒ, blur: ƒ, focus: ƒ, close: ƒ, frames: Window, …} CompanyAccountsList.jsx?a48a:36
undefined

在安慰的'window对象''enableMouseFlow'可用,但当我试图将它作为console.log(window.enableMouseFlow);它被安慰为'undefined'

如果我在render()方法中控制它,我得到的结果如下:

ƒ () {
          sessionStorage.setItem('mf_start', '1');
          activateMouseflow();
      }

总结一下,我在componentDidMount()中找不到'window.enableMouseFlow'

arrays reactjs ecmascript-6 react-redux
2个回答
1
投票

我认为console.log正在传递对窗口的引用,因此它可能在它实际登录到控制台时被解析。你可以试试

const x = JSON.stringify(window); console.log(x);(我认为在componentDidMount时会给你一个窗口)

但我猜测,在一些其他脚本中创建页面之后,enablemouseflow会被添加到window中,因此它实际上并不适用于此组件。 (但可以在渲染时使用)。


0
投票

@Alan是的,我实际上是在componentDidMount中获取窗口,即使我在控制台窗口中,我也可以在控制台中获得enableMouseFlow。

console.log(window);

Output: 
//window.enableMouseFlow is available

但是,如果我只控制window.enableMouseFlow,我将其视为未定义

console.log(window.enableMouseFlow);

Output:
//Undefined
////window.enableMouseFlow is not available

其次,是的,我想的是你在一些其他脚本中创建页面之后将enablemouseflow添加到窗口但我有一些其他类似的reactJs页面,我可以在componentDidMount中获取console.log(window.enableMouseFlow)

仅供参考,在浏览器控制台中填充页面后,我可以获得console.log(window.enableMouseFlow);

实际上window.enablemouseflow实际上加载了一点,请看截图:console screenshot

© www.soinside.com 2019 - 2024. All rights reserved.