ли я на самом деле нужен использовать forceUpdate с выборкой API и ReactJS

Question

Я использую React и fetch() для разработки пользовательского интерфейса, и я в конечном итоге делаю это:

getOperatorsList: function (obj) { 
    fetch('http://x.x.x.x/operators.list', 
     { 
      method: 'GET', 
      credentials: 'include' 
     } 
    ).then(function (response) { 
      return response.json() 
     }).then(function (json) { 
     if (json.statusCode === 3) { 
      cookieService.unsetCookie('sessId'); 
     } 
     obj.setState({ data: json },() => obj.forceUpdate()); 
    }).catch(function (ex) { 
     console.log('parsing failed', ex); 
    }) 

} 

Это называется в моих компонентах операторов, который выглядит как это

var Operators = React.createClass({ 

    getInitialState: function() { 
     return { 
      data: [{ "data": "Loading" }] 
     } 
    }, 

    componentDidMount: function() { 
     operatorsService.getOperatorsList(this); 
    }, 

    render: function() { 
     return (
      <div> 
       <Row > 
        <Col> 
         <DataTablesCustom data={this.state.data} /> 
        </Col> 
       </Row> 
      </div> 
     ); 
    } 
}); 

Я уже имел взгляд на this question, а код не работает для меня.

Это прекрасно работает, но мне действительно нужно использовать forceUpdate() или у меня есть способ сделать код «чище»?

EDIT: был setState, который выглядел так: this.setState({stuff: stuff}, this.function()}); в дочернем компоненте. Мне удалось удалить forceUpdate() после изменения setState на this.setState({stuff: stuff},() => this.function()});.

Answer 1

Чтобы получить код для работы, вы можете попробовать сделать это в службе:

obj.setState.bind(obj)({ data: json }); 

Однако, нет необходимости передавать компонент объекта к службе. Возможно, это не такая хорошая идея, как вы просто связываете вещи, когда это не нужно. Пусть компонент Вызов службы, а затем решить, что делать с данными:

getOperatorsList: function() { 
    return fetch('http://x.x.x.x/operators.list', { 
     method: 'GET', 
     credentials: 'include' 
    }).then(function (response) { 
     return response.json() 
    }).then(function (json) { 
     if (json.statusCode === 3) { 
      cookieService.unsetCookie('sessId'); 
     } 
     return json; 
    }).catch(function (ex) { 
     console.log('parsing failed', ex); 
    }) 

} 

Тогда в компоненте:

componentDidMount: function() { 
    operatorsService.getOperatorsList() 
    .then(function (json) { 
     this.setState({ data: json }); 
    }.bind(this)) 
}