首页 > 解决方案 > 获取数据后对设置状态做出反应

问题描述

我正在创建一个表单,我想在初始加载时加载数据。

我已经设置了 Mount 来调用我的函数 fetchClaims。我收到了结果,我可以通过控制台记录它。我不能做的是用它更新我的状态,以便我可以在我的表单中使用它。

componentDidMount() {
  this.onInit(this.props);
}

onInit = props =>
  props
    .fetchClaims()
    .then(results => console.log('results = ' + JSON.stringify(results)))
    .then(claims => this.setState({ results }))
    .then(results =>
      console.log('results state = ' + JSON.stringify(this.state)),
    );

结果数据看起来像

results = {
  type: 'CLAIMS_FETCHED',
  claims: [
    {
      _id: '5b0d5b7f035a00f06003e6b8',
      claimID: '123456',
      claimDate: '2018-05-14T00:00:00.000Z',
      carrier: 'BCBS NJ',
    },
  ],
};

状态看起来像

state = {
  data: { email: '' },
  loading: false,
  errors: {},
  fromdate: '',
  todate: '',
  claims: {},
  results: {},
};

我想将 Claims 数组填充到 state 中的声明中,然后对其进行映射。

标签: javascriptreactjsreact-native

解决方案


尝试在第一个控制台日志之后返回值,并在设置状态时修复参数名称。

onInit = props => props.fetchClaims()
    .then(results => {
        console.log("results = " + JSON.stringify(results));
        return results;
    })
    .then(results => this.setState({ claims: results.claims }))
    .then(() => console.log("results state = " + JSON.stringify(this.state)));

推荐阅读