获取 window 未在 ReactJs 上定义
Getting window is not defined on ReactJs
我收到错误:"ReferenceError: window is not defined"
在 React 上。
下面是我的代码:
import React from 'react';
import styles from './Header.css';
import withStyles from '../../decorators/withStyles';
import Link from '../../utils/Link';
import SignInMenu from './SignInMenu';
import UserMenu from './UserMenu';
import Navigation from '../Navigation';
import { canUseDOM } from 'fbjs/lib/ExecutionEnvironment';
@withStyles(styles)
class Header extends React.Component {
constructor() {
super();
return {
windowWidth: 0,
windowHeight: 0
};
}
componentDidMount() {
this.setState({
windowWidth: window.innerWidth,
windowHeight: window.innerHeight
});
}
render() {
let windowWidth = this.state.windowWidth;
let windowHeight = this.state.windowHeight;
if (windowWidth < 1000) {
let header = (<div>mobile</div>);
} else {
let header = (<div>desktop</div>);
}
}
我正在尝试为桌面和移动设备呈现不同的视图,并且刚刚开始使用 React。我不确定我是否做对了,在网上遵循一些指南并被困在这里。关于我做错了什么的任何想法?谢谢
您的问题可能出在您的构造函数中。
constructor() {
super();
this.state = {
windowWidth: 0,
windowHeight: 0
};
}
我收到错误:"ReferenceError: window is not defined"
在 React 上。
下面是我的代码:
import React from 'react';
import styles from './Header.css';
import withStyles from '../../decorators/withStyles';
import Link from '../../utils/Link';
import SignInMenu from './SignInMenu';
import UserMenu from './UserMenu';
import Navigation from '../Navigation';
import { canUseDOM } from 'fbjs/lib/ExecutionEnvironment';
@withStyles(styles)
class Header extends React.Component {
constructor() {
super();
return {
windowWidth: 0,
windowHeight: 0
};
}
componentDidMount() {
this.setState({
windowWidth: window.innerWidth,
windowHeight: window.innerHeight
});
}
render() {
let windowWidth = this.state.windowWidth;
let windowHeight = this.state.windowHeight;
if (windowWidth < 1000) {
let header = (<div>mobile</div>);
} else {
let header = (<div>desktop</div>);
}
}
我正在尝试为桌面和移动设备呈现不同的视图,并且刚刚开始使用 React。我不确定我是否做对了,在网上遵循一些指南并被困在这里。关于我做错了什么的任何想法?谢谢
您的问题可能出在您的构造函数中。
constructor() {
super();
this.state = {
windowWidth: 0,
windowHeight: 0
};
}