сохранить предыдущее состояние в один массив в ReactJS - PullRequest
0 голосов
/ 10 января 2019

У меня есть класс, который получает доступные средства на счете из REST API. Этот номер сохраняется в состоянии.

Мне нужно создать отдельное состояние, в котором я буду хранить массив всех изменений состояния

Например, мое состояние availableFunds: 86 Поэтому я хотел бы, чтобы мои availableFundsArray вернулись: [86]

Если мое состояние availableFunds меняет номер, например: 60 Поэтому я хотел бы, чтобы мой availableFundsArray вернул: [86, 60]

class AvailableFunds extends Component {
  constructor() {
    super();

    this.state = {
      availableFunds: [],
      availableFundsArray: [],
    };
  }

componentDidMount() {
    this.Auth.availableFunds(this.props.id)
      .then(res => {
        if (res) {
          this.setState({
            availableFunds: res.reduce(
              (accumulator, currentValue) =>
                accumulator + currentValue.available_funds,
              0,
            ),
          });
        }
      })
      .catch(err => {
        console.log(err);
      });
  }

Ответы [ 2 ]

0 голосов
/ 10 января 2019

Внутри вашего оператора if вы можете вычислить до setState доступные средства и использовать эту переменную для обновления состояния с помощью prevState, как показано ниже

this.Auth.availableFunds(this.props.id)
      .then(res => {
        if (res) {
            const amount = res.reduce((accumulator, currentValue) => accumulator + currentValue.available_funds, 0, )

            this.setState( prevState => {
            return {
                availableFunds: amount,
                availableFundsArray: [...prevState.availableFundsArray, amount]
            }
          });
        }
      })
     .catch(err => {
        console.log(err);
      });
0 голосов
/ 10 января 2019

Когда вы устанавливаете setState, обращайтесь к предыдущей форме состояния и добавляйте к ней.

Иметь в наличииFunds число, а не массив.

let funds = [this.state.availableFunds];

funds.push(this.state.availableFunds)

this.setState({
    availableFundsArray: funds
})
...