小编dig*_*ake的帖子

浏览器上的Rerender视图使用React调整大小

在调整浏览器窗口大小时,如何让React重新渲染视图?

背景

我有一些块,我想在页面上单独布局,但我也希望它们在浏览器窗口更改时更新.最终结果将是Ben Holland的 Pinterest布局,但使用React编写的不仅仅是jQuery.我还有一段路要走.

这是我的应用程序:

var MyApp = React.createClass({
  //does the http get from the server
  loadBlocksFromServer: function() {
    $.ajax({
      url: this.props.url,
      dataType: 'json',
      mimeType: 'textPlain',
      success: function(data) {
        this.setState({data: data.events});
      }.bind(this)
    });
  },
  getInitialState: function() {
    return {data: []};
  },
  componentWillMount: function() {
    this.loadBlocksFromServer();

  },    
  render: function() {
    return (
        <div>
      <Blocks data={this.state.data}/>
      </div>
    );
  }
});

React.renderComponent(
  <MyApp url="url_here"/>,
  document.getElementById('view')
)
Run Code Online (Sandbox Code Playgroud)

然后我有了Block组件(相当于Pin上面Pinterest示例中的一个):

var Block = React.createClass({
  render: function() {
    return ( …
Run Code Online (Sandbox Code Playgroud)

javascript resize reactjs

275
推荐指数
15
解决办法
20万
查看次数

标签 统计

javascript ×1

reactjs ×1

resize ×1