How to dynamically create arrays in state?

Question

React

I wanted to create dynamic blocks with adding files, but due to the fact that the state of the files is common, the files are added to all blocks, and I don’t understand how to make sure that when a file is added to a separate block, a separate array is created with the files of this block and this array of files was added to one common state, for the second day I can’t figure out how to do it, I threw in a working fiddle, please help with advice, or show how this can be done in practice

my version https://codesandbox.io/embed/trusting -cdn-oqt6l?fo...

Answer 1

it's hard to read in sanbox there you can create something like a react project and it will beautifully highlight everything
the idea is this is what the
state should be something like that

state={
"1":{} //первый файл,
"2":{} //второй файл 
};
//изменение 2 файла
setState({...state,2:{}})
//добавление 3 файла
setState({...state,3:{}})

therefore, when rendering "add file", the desired file is taken,
I hope the idea is clear