首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >在将状态设置为react ES-6之后,无法到达语句。

在将状态设置为react ES-6之后,无法到达语句。
EN

Stack Overflow用户
提问于 2015-09-08 06:49:25
回答 2查看 346关注 0票数 0

在这个function代码中,我试图将数据设置为当前状态,在将数据设置为需要在固定数据"this.setState“中使用的状态之后,我编写了below.The,主要问题是,在componentDidMount中的below.The旁边的语句没有被执行/到达需要在那里调用数据表函数的位置。这是我的代码:

代码语言:javascript
复制
     export default class Main extends React.Component {
        constructor(props) {
            super(props);
            this.state = {
                result: [],
                loading: false,
                filteredRows: null,
                filterBy: null,
            };
        }
        getZipData() {
            //Here i got the data from server 
        }
        componentDidMount() {
            this.getZipData().then((data)=>{
                console.log("data:"+data.length);
                this.setState({result:data,loading:true});  //state successfully set here.
                console.log("result:*******************"+this.state.result.length); //this console is not printed
this._filterRowsBy(this.state.filterBy)
            });

        };
        _rowGetter(rowIndex){
            alert("row Getter");
            return this.state.filteredRows[rowIndex];
        }
        _filterRowsBy(filterBy){
            var rows = this.state.result.slice();
            var filteredRows = filterBy ? rows.filter((row)=>{
                return row.RecNo.toLowerCase().indexOf(filterBy.toLowerCase()) >= 0
            }) : rows;
            this.setState({
                filterRows,
                filterBy,
            })
        }
        _onFilterChange(e){
            this._filterRowsBy(e.target.value);
        }
        render() {
            if(this.state.loading==false) {
                return (
                    <div className="row-fluid">
                        <img className="col-sm-6 col-sm-offset-3 col-xs-6 col-xs-offset-3"
                             src="http://www.preciseleads.com/images/loading_animation.gif"/>
                    </div>
                )
            }
            else{
                console.log("result:////////////////////"+this.state.result.length); //this console is printed
                console.log("loading completed");
                return(
                    <div>
                       <!-- fixed data table code goes here -->
                    </div>
                )
            }

        }
    }

状态已成功更新,但在未到达该语句之后,在componentDidMount,中任何帮助都非常感谢。

EN

回答 2

Stack Overflow用户

发布于 2015-09-08 07:18:08

在您的承诺中添加一个捕获处理程序。我想你搞错了。

票数 1
EN

Stack Overflow用户

发布于 2015-09-08 21:21:04

嗨,也许这是你的问题,

Facebook:

setState()不会立即改变this.state,而是创建一个挂起的状态转换。调用此方法后访问this.state可能会返回现有值。对setState的调用不能保证同步操作,为了提高性能,调用可以批处理。除非在setState()中实现了条件呈现逻辑,否则shouldComponentUpdate()总是会触发重呈现。如果正在使用可变对象,并且不能在shouldComponentUpdate()中实现逻辑,那么只有在新状态不同于以前的状态时才调用setState()将避免不必要的重呈现。

代码语言:javascript
复制
  this.setState({result:data,loading:true}, () => {
    // Your logic
  });

第二个参数是一个回调函数,它在设置状态后调用。

希望这会有所帮助:)

编辑:我没有看到不变的错误,(从注释中,你能提供完整的错误吗)

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/32451009

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档