窗口未定义

Question

我在我的项目中使用 ReactJS，我想通过使用 window.location.href 来访问我当前的 URL。当我使用 window.location.href 时，我收到一条错误消息，提示未定义窗口。

// --- REACT + CUSTOM-TAGS ---
const SampleApp = ({value}) => {
    // --- CUSTOM-SCRIPTS ---
    addMeta([
        {type: 'meta', content: {content: 'something'}},
        {type: 'link', content: {rel: 'http://link'}},
    ]);

    //Append the value from the URL
    const prId = "12512" //We can make it dynamic
    const url = window.location.href;//window,location.href;
    const id = url.substring(url.lastIndexOf('/') + 1);
    const output = id.replace(/[a-zA-Z=]/g, '');

    return (
        <div>
            <h1>Hello {value}</h1>
            <hr />
            <h2>{url} took from prId</h2>
            <hr />
            <h2><a className="redirect" href={'//www.check.com/prId/' + output} target="_blank">Click Here</a>
            </h2>
        </div>
    );
};

Answer 1

位置在 props 中，因为在 React 中没有定义 window。

只需使用this.props.location.pathname 而不是window.location.href。

更多信息，如果你记录道具。

Answer 2

安装这个库 npm install --save-dev --save-exact jsdom jsdom-global 然后在组件顶部导入它 import 'jsdom-global/register'; 希望对您有所帮助。