TypeError: Невозможно прочитать свойство 'уменьшает' неопределенного в реакции - PullRequest
Новая
       12

TypeError: Невозможно прочитать свойство 'уменьшает' неопределенного в реакции

0 голосов
/ 15 мая 2019

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

Итак, у меня есть пара полей ввода и кнопка отправки: 

<button onClick={this.handleSubmit}>Submit</button>
         {
           this.state.credentials &&
           //<Credentials value={this.state}/>
            <Credentials value={JSON.stringify(this.state, undefined, 2)} />
         }

Функция Credentials преобразует состояние компонента в формат JSON: 

<code>const Credentials = ({value} ) => {
    return <pre>{formatState(value)}
;}

Функция formatState в основном будет манипулировать значениями состояния и отображать их так, как я хочу: 

function formatState(state) {
  console.log("hi")
  console.log(state);
    const output = state.groups.reduce((final, s)=> {
      console.log(output)
      const values = Object.keys(s).reduce((out, o)=> {
        out[o] = s[o].map(k => Object.values(k))
        return out;
        }, {})
        final =  {...final, ...values}
        return final;
      }, {})
      console.log(output) 
  }

Состояние выглядит следующим образом: 

{
  "groups": [
    {
      "typeA": [
        {
          "name": "abc"
        },
        {
          "number": "13,14"
        }
      ],
      "typeB": [
        {
          "country": "xyz"
        },
        {
          "date1": "2019-05-14"
        }
      ]
    }
  ]
}

Но я хочу вывод, подобный этому: 

groups: {
"typeA": [[abc],[13,14]],
"typeB": [[2019-05-14],[xyz]]
}

SO, функция уменьшения используется для преобразования состояния в следующий вывод.Но я получаю сообщение об ошибке: «TypeError: Невозможно прочитать свойство« уменьшить »из неопределенного» * ​​1020 *

Пожалуйста, кто-нибудь может сказать мне, почему это происходит.

1 Ответ

1 голос
/ 15 мая 2019

Ошибка здесь <Credentials value={JSON.stringify(this.state, undefined, 2)} />.JSON.stringify создает строковое представление некоторого объекта (this.state в вашем случае).Аргумент state из formatState имеет тип строки.Кажется, что вы хотите иметь state аргумент, чтобы быть объектом.Таким образом, вы должны сделать 

<Credentials value={this.state} />
...