Question

我正在阅读这些装饰器并将@withViewPort用法命名为：

import React from 'react';
import withViewport from 'react-decorators/withViewport';

@withViewport
class MyComponent {
  render() {
    let { width, height } = this.props.viewport;
    return <div>Viewport: {width + 'x' + height}</div>;
  }
}

React.render(<MyComponent />, document.body);

@withViewPort装饰工作如何工作？在调整窗口大小时是否有状态和这些状态更改？

Answer 1

它是一个更高阶的组件，它会向您的组件添加一个侦听window.resize的处理程序。 Src：https://github.com/kriasoft/react-decorators/blob/master/src/withViewport.js

装饰者和做的一样：

const MyComposedComponent = withComponent(MyComponent);
render(<MyComposedComponent />, document.body);

@withViewPort装饰器如何在React中工作？

1 个答案: