Просто используйте Array.filter()
, чтобы создать новый массив, не содержащий определенного элемента.Итак, ваш новый массив цветов для этого desc:
this.state.products[select].colors.filter( color => color.a !== 'orange' )
При этом сохраняются все цвета, где a
не оранжевый.Имейте в виду, что массивы начинаются с нуля, поэтому ваши select
и index
должны начинаться с 0.
Если вы не хотите хранить фактические индексы, используйте вместо них desc.
Так что если select
будет gfgfg
вместо индекса массива, вы можете сделать:
const state = {
products: [
{
colors: [{a:'black'}, {a:'orange'}, {a:'purple'}],
desc: 'gfgfg'
},
{
colors: [{a: 'yellow'}, {a: 'white'}, {a:'gray'}],
desc: 'gfgfgfg'
},
{
colors: [{a: 'pink'}, {a: 'brown'}, {a:'green'}],
desc: 'gfgfgfg'
}
],
selected_product: 'gfgfg',
color: 'orange'
};
const setState = update => Object.assign( state, update );
console.log( 'before update' );
console.log( JSON.stringify( state.products[0] ));
setState({
products: state.products.map( product => {
if ( product.desc === state.selected_product ) {
product.colors = product.colors.filter( color => color.a !== state.color );
}
return product;
})
});
console.log( 'after update' );
console.log( JSON.stringify( state.products[0] ));
Та же логика, очевидно, может быть выполнена с использованием индексов, но это может привести к увеличению длины кода.Возможно, придется обновить часть кода, если все должно быть полностью неизменным.