0
votes

Pourquoi quand je change de copie de l'objet dans TS, l'original change également?

J'imports Redux Store et à l'aide de l'opérateur de diffusion pour créer une copie de la propriété de magasin. Ensuite, lorsque je change cette copie, la propriété d'origine change également.

Quand j'utilise copie = json.parse (json.stringify (original)) code> tout fonctionne bien. P>

export const move = (moveData: IMove): BoardActionTypes => {
  const { board } = store.getState();
  console.log(board.pieces.byId["19"]); // {row: 3, col: 7}

  const newById: IPiecesById = { ...board.pieces.byId };

  newById["19"].col = 4;
  newById["19"].row = 4;

  console.log(board.pieces.byId["19"]); // {row: 4, col: 4}
  console.log(newById["19"]); // {row: 4, col: 4}

  //...
};

reactjs typescript redux

0 commentaires

3 Réponses :

0
votes

J'ai 2 options pour cela.

1. Utilisation de Underscore.js code> strud> p>

p>



function clone(obj) {
  if (obj === null || typeof(obj) !== 'object')
  return obj;

  var copy = obj.constructor();

  for (var attr in obj) {
    if (obj.hasOwnProperty(attr)) {
      copy[attr] = obj[attr];
    }
  }

  return copy;
}

var foo = { row: 0, col: 0 };
var bar = clone(foo);
bar.row = 99;

console.log(foo);
console.log(bar);

0 commentaires

2
votes

Votre problème concerne la copie de VS peu profonde d'un objet.

Lorsque vous utilisez l'opérateur de répression, votre création d'une copie peu profonde d'un objet (comme lors de l'utilisation de l'ancienne école objet.Assign ).

Lorsque vous avez utilisé JSON analysant - vous obtenez une copie profonde (ou un "clone profond") de l'objet.

Copie peu profonde, comme le nom suggère, signifie que l'objet extérieur est un nouveau, tandis que les objets imbriqués restent les mêmes. Une fois que vous avez appris à connaître Redux en profondeur, les opérateurs de Singard doivent suffirent pour la plupart des cas, mais c'est une différence importante à garder à l'esprit.

Vous voudrez peut-être lire Ma question sur cette question , et Cet article aussi ,.

0 commentaires

0
votes

Qu'est-ce qui vous arrive, c'est - deux objets avec la même référence.

Si vous ne voulez pas utiliser une libération externe, ou une fonction d'assistance (si vous n'allez pas l'utiliser de manière approfondie), vous pouvez Utilisez quelque chose comme ceci: p>

const newById = board.pieces.byId.map((item) => ({ ...item }));

0 commentaires