Невозможно получить доступ к глубокому вложенному свойству объекта без ошибки только для чтения - PullRequest
Новая
       15

Невозможно получить доступ к глубокому вложенному свойству объекта без ошибки только для чтения

0 голосов
/ 25 апреля 2019

Каждый раз, когда я пытаюсь получить доступ к свойству глубокого уровня (я думаю, элемент в массиве по его индексу), я получаю следующую ошибку:

ОШИБКА TypeError: Невозможно назначить только для чтения свойство 'value' объекта '[object Object]'

Найдите ниже код, который я пытаюсь запустить, но выдает ошибку выше: 

@Input() data: CivilLiabilityQuestionnaireModel;
public questions: CivilLiabilityQuestionnaireModel;

this.questions = { ...this.data };

const questionGroupIndex = 0;
const questionGroupItemIndex = 0;

this.questions
    .questionGroup[questionGroupIndex]
    .questionGroupItems[questionGroupItemIndex]
    .answers[0]
    .value = form[val];

Немного подробнее о том, что возможно: 

// This works
this.questions.id = 'hotdog';

// This doesn't work
// ERROR TypeError: Cannot assign to read only property 'id' of object '[object Object]'
this.questions.questionGroup[questionGroupIndex].id = 'hamburger';

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

Вот распространенное решение, которое я пробовал: 

this.questions = {
  ...this.questions,
  questionGroup: {
    ...this.questions.questionGroup,
    [questionGroupIndex]: {
      ...this.questions.questionGroup[questionGroupIndex],
      questionGroupItems: {
        ...this.questions.questionGroup[questionGroupIndex].questionGroupItems,
        [questionGroupItemIndex]: {
          ...this.questions.questionGroup[questionGroupIndex].questionGroupItems[questionGroupItemIndex],
          answers: {
            ...this.questions.questionGroup[questionGroupIndex].questionGroupItems[questionGroupItemIndex].answers,
            [0]: {
              ...this.questions.questionGroup[questionGroupIndex].questionGroupItems[questionGroupItemIndex].answers[0],
              value: form[val]
            }
          }
        }
      }
    }
  }
};

Ответы [ 2 ]

0 голосов
/ 25 апреля 2019

Мне удалось найти решение проблемы. В моем примере из исходного вопроса я сделал следующее: 

this.questions = { ...this.data };

Решение пришло из другого поста: https://stackoverflow.com/a/40922716/2664414

Проблема с приведенным выше примером заключается в том, что вы создаете только клон корневого свойства, в то время как вложенные дочерние свойства остаются замороженными.

Так как мое значение пришло из магазина NGRX, оно в основном находится в состоянии «заморозки» и не может быть изменено.

Чтобы исправить это, вы можете использовать cloneDeep() из lodash, чтобы убедиться, что вложенные свойства также клонируются и теряют состояние «заморозки». 

this.questions = _.cloneDeep(this.data);
0 голосов
/ 25 апреля 2019

Может быть, вы где-то определили что-то как constant, и вы пытаетесь изменить это. Javascript, естественно, не поддерживает реквизиты только для чтения, поэтому на практике единственная причина, по которой эта ошибка возникает, заключается в том, что вы либо определили некоторую переменную / prop как constant, либо вы определили реквизит obj как writable=false, и вы пытаетесь изменить его , Ищите questionGroupIndex или questionGroupItemIndex, возможно, вы пытаетесь изменить их. В любом случае проблема не во вложении.

...