Реквизит обновляется без отправки в React

Question

«реагировать»: «^ 16.4.1», «Реакция-Дом»: «^ 16.4.2», «Reaction-Redux»: «^ 5.0.7», "redux": "^ 4.0.0", "redux-thunk": "^ 2.3.0", "webpack-dev-server": "^ 3.1.5"

const items = this.props.cart.cartItems;
const index = items.indexOf(item1);
items.splice(index, 1);
this.setState({ finalPrice: 0 });

В этом сценарии реквизиты cartItems обновляются до переменных items без диспетчерского действия.

Answer 1

Это потому, что вы изменяете свойство объекта объекта, который скопирован с другого без глубокого копирования. Таким образом, когда вы изменяете вложенное свойство, оно также меняет исходный объект. Либо вы делаете глубокую копию, либо меняете объекты, не изменяя их.

• Присвоение одного объекта другому не создает совершенно другой объект, если вы не сделаете глубокую копию. Обе ссылки на объекты указывают на один и тот же объект.

• splice изменяет исходный массив. Используйте slice или другие методы, например filter.

const cart = {
  cartItems: [
    "foo", "bar", "baz"
  ],
}

console.log( "original one before update", cart.cartItems );

const index = cart.cartItems.indexOf("foo");
const items = cart.cartItems.filter( (_, i) => i !== index );

console.log( "original one after update", cart.cartItems );
console.log( "new items", items );