錯誤Node.js中的`窗口未定義'

Question

我知道window在Node.js中不存在，但我在客戶端和服務器上都使用了React和相同的代碼。任何方法我用它來檢查，如果存在window網我：

Uncaught ReferenceError: window is not defined

，我不能做window && window.scroll(0, 0)如何迴避的事實得到什麼？

Answer 1

Sawtaytoes已經得到它。我會運行任何代碼你componentDidMount（有），並圍繞着它：

if (typeof(window) !== 'undefined') { 
    // code here 
} 

如果仍沒有被時間所創建的窗口對象發生反應呈現組件，你總是可以運行你的代碼的一小部分第二次在組件渲染後（並且窗口對象肯定是在那時創建的），所以用戶無法區分這種差異。

if (typeof(window) !== 'undefined') { 
    var timer = setTimeout(function() { 
     // code here 
    }, 200); 
} 

我會建議不要在setTimeout中放置狀態。

Answer 2

這將解決這一問題，爲您提供：

typeof(window) === 'undefined' 

即使沒有定義的變量，你可以使用typeof()來檢查它。

Answer 3

這種代碼甚至不應該在服務器上運行，它應該在一些componentDidMount（see doc）鉤子裏面，它只調用客戶端。這是因爲滾動窗口服務器端沒有意義。但是，如果您必須在真正運行客戶端和服務器的部分代碼中引用窗口，請改用global（代表全局範圍 - 例如客戶端上的window）。

Answer 4

<Router onUpdate={() => window.scrollTo(0, 0)} history= {browserHistory}> 

，如果您需要在上面打開新的一頁陣營JS應用程序，使用router.js

Answer 5

這個代碼這是年紀大一點的，但對於ES6風格反應組件類，你可以使用這個類裝飾我創建了一個解決方案，用於定義僅應在客戶端呈現的組件。我喜歡它比任何地方的窗口檢查更好。

import { clientOnly } from 'client-component'; 

@clientOnly 
class ComponentThatAccessesWindowThatIsNotSafeForServerRendering extends Component { 
    render() { 
     const currentLocation = window.location; 
     return (
      <div>{currentLocation}</div> 
     ) 
    }; 
} 

https://github.com/peterlazzarino/client-component