When I want to copy the state like this:
let copy = this.state.foo
copy.push('bar')
the state copied correctly, but with its reference, and when I change 'copy' the main state changes.
What should I do to avoid this change?
1 Answer
You can use array spread or Array.concat() to make a shallow clone, and add new items as well):
const state = {
foo: ['bar']
};
const copy = [...state.foo, 'bar'];
console.log(copy === state.foo); // false
8 Comments
Mahdi
Oh, man, My problem did not solve let me specify more I have a state that named bar and I have a function named addBar and this function add the last item of the bar to the bar but I want to copy it without reference I do what you said but it didn't work for me
Ori Drori
You should add more code.
Mahdi
`` addBar = () => { let bar = [...this.state.bars,{...this.state.bars[this.state.bars.length - 1]}] this.setState({ bars:bar }) } `` this code must add the last item of the bar to the bar but it doesn't work
Ori Drori
It seems like you clone the state.bars, and the last items of bars. And then without changing anything, you set it back to the state. Since you don't change anything, What are you trying to achieve? In addition, you should use setState with an updater function.
Ori Drori
@mahdi - add whatever seems relevant to the question, to the question. In addition, please explain why you are doing it at all.
|
.slice()