Блог

Вот картинка того, что я получаю на консоли <br><br>

Я использую React.js , а объект, показанный на изображении, является элементом массива, который является частью объекта состояния. Я не понимаю, что происходит. Объект показывает, чего от него ожидают при сворачивании. Но когда я разворачиваю его с помощью кнопки со стрелкой вправо, расширенная версия объекта выдает этот результат. Кто-нибудь может, пожалуйста, сказать мне, что здесь происходит? Я хочу уточнить, что я не использовал setState для обновления состояния до этого состояния, так как хотел убедиться, что избегаю повторного рендеринга.

вот код для того, что я сделал, чтобы обновить состояние

 if (this.props.currentNumberingScheme === 'a') {
  var edge = this.state.edgeList[i];
  edge.from.data = String.fromCharCode(parseInt(edge.from.data)   64);
  edge.to.data = String.fromCharCode(parseInt(edge.to.data)   64);
  console.log('GRAPH: updated edge', edge.from.data, edge.to.data);
  console.log('GRAPH: updated edge', this.state.edgeList[0].from.data, this.state.edgeList[0].to.data);
  console.log('GRAPH: transformed edge list', this.state.edgeList[0].from);
  console.log('GRAPH: updated edge', this.state.edgeList[0].from.data, this.state.edgeList[0].to.data);
}
 

когда я регистрирую edge.from.data и edge.to.data , вывод на самом деле является ‘A’ и ‘B’ (как и ожидалось). когда я регистрируюсь this.state.edgeList[0].from , происходит явление, показанное на изображении. Кто-нибудь может, пожалуйста, уточнить??

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

Проблема в том, что вы определяете переменную edge this.state примерно так:

 var edge = this.state.edgeList[i];
edge.from.data = String.fromCharCode(parseInt(edge.from.data) 64);
edge.to.data = String.fromCharCode(parseInt(edge.to.data) 64);
 

Эти вторые две строки изменяют edge объект, но не обновляются this.state с их измененными значениями. Поэтому, когда вы входите edge.from.data в систему и edge.to.data видите правильные значения, но когда вы регистрируете this.state.edgeList[0].from свои отображаемые данные, они не были обновлены.

Опять же, это связано с тем, что при изменении возвращаемый из this.state него объект не изменяется this.state .

Если вам действительно требуется объект с прямой изменчивостью, который не повторяется при изменении, вы, вероятно, могли бы использовать ref . Но, скорее всего, вам следует просто использовать обычный старый объект.