Как инициировать «обновление», извлекая значения из Redux Store?

Question

У меня есть набор данных, который корректно извлекает обновленные значения из Saga API (отображается правильно в console.log ()), однако он не обновляет значения в пользовательском интерфейсе при извлечении, чтобы обновить страницу.

Я пытался вручную переназначить новый обновленный JSON из обновления, чтобы переопределить старые данные, однако он просто возвращает нулевые значения

   // Scroll View
    <ScrollView
      refreshControl={
        <RefreshControl
          tintColor={'#E4E4E4'}
          refreshing={this.state.refreshing}
          onRefresh={this._onRefresh}
        />
      }
    >
      {exchanges.exchanges.length > 0 &&
        exchanges.exchanges.map((exchange, index) => (
          this.renderExchange(exchange, index)
        ))}
    </ScrollView>




 // Render Exchange 
 renderExchange = (exchange, index) => {
 const { account, exchanges } = this.props
 const { balances, exchangeArray } = this.state
 const { selectedExchange } = exchanges
 const { status, symbolPriceTicker, dayChangeTicker } = 
 selectedExchange
//this.setState({ balances: exchange.balances })
//AlertIOS.alert('I got here')

if (balances.length > 0 && exchangeArray.length > 0) {
  for (let i = 0; i < exchangeArray.length; i++) {
    if (exchange === exchangeArray[i]) {
      for (let j = 0; j < balances.length; j++) {
        console.log('Updated Balances: ' + JSON.stringify(balances[j]))
        console.log('Exchange Balances: ' + JSON.stringify(exchange.balances))
        exchange.balances = balances[j]
        balances.pop()
      }
    }
  }
}

return (
  <View style={screenStyles.container}>
  <ExchangeBox
    balances={exchange.balances}
    displayName={exchange.label}
    symbolPriceTicker={symbolPriceTicker}
    exchangeIndex={index}
    onSend={this.onSend}
  />
  <View style={screenStyles.largerContainer}>
    {symbolPriceTicker && dayChangeTicker && exchange.balances && (
      <ScrollView
        style={screenStyles.walletContainer}
        horizontal={true}
        showsHorizontalScrollIndicator={false}
        decelerationRate={0}
        snapToInterval={100} //your element width
        snapToAlignment={'center'}
      >
        {Object.keys(exchange.balances).map(
          symbol =>
            COIN_INFO[symbol] &&
            symbolPriceTicker[`${symbol}USDT`] && (
              <CoinContainer
                key={symbol}
                symbol={symbol}
                available={exchange.balances[symbol].free}
                price={symbolPriceTicker[`${symbol}USDT`]}
                dayChange={dayChangeTicker[`${symbol}USDT`]}
              />
            ),
        )}
      </ScrollView>
    )}
  </View>
</View>
)
}




fetchData = () => {
  const { exchanges } = this.props
  const { balances, exchangeArray } = this.state
  // Needs to fetch information to refresh
  if (exchanges.exchanges.length > 0) {
    exchanges.exchanges.map((exchange) => (
      balances.push(this.props.getBalances(exchange.balances)),
      exchangeArray.push(exchange)
      //console.log(exchange.balances)
    ))
    this.setState({ refreshing: false })
  } else {
    this.setState({ refreshing: false })
  }
}




componentDidMount() {
  this.fetchData()
}




_onRefresh = () => {
  this.setState({ refreshing: true })
  this.fetchData()
}

Есть ли способ успешно переназначить эти значения илиЕсть ли лучший способ сделать это обновление?

Answer 1

Ваш fetchData не извлекает данные, я не понимаю этот метод.

Но я вижу, что вы неправильно меняете состояние без использования setState.

Так что я просто попытался исправить это с минимальными изменениями.

fetchData = () => {
  const { exchanges } = this.props
  // you need to make new arrays, thats why we are using slice.
  const balances = this.state.balances.slice(); 
  const exchangeArray = this.state.exchangeArray.slice();

  if (exchanges.exchanges.length > 0) {
    exchanges.exchanges.map((exchange) => (
      balances.push(this.props.getBalances(exchange.balances)),
      exchangeArray.push(exchange)
      //console.log(exchange.balances)
    ))
   // we need to update the state using, setState, and passing our 2 arrays.
    this.setState({ refreshing: false, exchangeArray, balances })
  } else {
    this.setState({ refreshing: false })
  }
}