РЕАКТИВНО, как хранить объект вместо массива объектов в setState? - PullRequest
Новая
       23

РЕАКТИВНО, как хранить объект вместо массива объектов в setState?

0 голосов
/ 12 сентября 2018
  1. Я пытаюсь сохранить данные как объект, и я получаю массив объектов, я пытаюсь сделать это без изменения исходного состояния объекта, который является фактическим массивом объектов, это для моей логики внешнего интерфейса, которая делает это просто, если у меня есть простой объект (dict).

Я установил CodeSandbox

в основном, я получаю это: 

currencies: [{MXN: "10"},{USD: "10"},{GBP: "10"}]

и я ищу это: 

currencies: {MXN: "10", USD: "10", GBP: "10"}

сокращен для удобства чтения, вы можете попробовать его в CodeSandbox , просто проверьте консоль, она готова.

  1. Если есть известный способ избежать создания нового состояния и просто использовать первое, пожалуйста, дайте мне знать, как и где я могу прочитать об этом, я все еще изучаю React. Я пытался создать свойство внутри класса для хранения там значений, но думаю, что я не понимаю, как оно работает.

Что-то вроде этого: 

currencies = {MXN: this.state.axiosCurrencies[0].value, 
              USD: this.state.axiosCurrencies[1].value, 
              GBP: this.state.axiosCurrencies[2].value}

1 Ответ

0 голосов
/ 12 сентября 2018

Состояние axiosCurrencies должно содержать имя ключа, а также значение для создания необходимого вам объекта. Поэтому сохраняйте свой доллар, фунт стерлингов и т. Д., Как указано в приведенном ниже коде.

Сделайте что-то вроде ниже 

    //keep your currencies as an object in state
    constructor(props){
          this.state = {
             currencies: {},
               // you need to construct your data axiosCurrencies like below
            axiosCurrencies: [{“id”: “01”, “name”: “MXN”, “value”: “abc”}, {“id”: “02”, “name”: “USD”, “value”: “xyz”}, {“id”: “03”, “name”: “GBP”, “value”: “def”}]
         }
    }

     //you can do below iteration in either componentDidMount or componentWillReceiveProps. Use componentWillReceiveProps if you are not using react v16.3 or greater version because this method is deprecated in latest versions.

    //do something like below to construct an object as you need.
    const obj = {};
    const { axiosCurrencies } = this.state;
     axiosCurrencies.forEach((item, index) => {
           obj[item.name] = item.value;
     });
     this.setState({
         currencies: obj
     });
...