事件应用实践
表单事件与输入校验
鼠标事件与悬浮反馈
触摸事件与 onTouchTap
浏览器监听
缩放监听
class WindowWidth extends React.Component {
  constructor(props) {
    super(props);
    this.state = { width: 0 };
  }
  componentDidMount() {
    this.setState({ width: window.innerWidth });
    window.addEventListener("resize", ({ target }) => {
      this.setState({ width: target.innerWidth });
    });
  }
  render() {
    const { width } = this.state;
    const { Width } = this.props;
    return <Width width={width} />;
  }
}
<WindowWidth Width={DisplayWindowWidthText} />;
const DisplayDevice = ({ width }) => {
  let device = null;
  if (width <= 480) {
    device = "mobile";
  } else if (width <= 768) {
    device = "tablet";
  } else {
    device = "desktop";
  }
  return <div>you are using a {device}</div>;
};