Push Array data to render View?-CodePudding

I am using Formik FieldArray to take input and store all inputs in an array and want to show all the input in a View, but I am getting an anonymous array in return. It didn't work for me. Can anyone help me out yr.


     const newData = [];
        const [storage, setstorage] = React.useState([]);
     const callFunction = (values) => {
            newData.push(values);
    
            console.log("0-0-1", newData);
    
            setstorage([newData => [...newData, storage]]);
            console.log("storage ", storage);
        }

     {
                 storage.length > 0 &&
                         <View>
                         {
                                 storage.map((menFor, index) =>
                          (
                            <View style={{
                                 paddingTop: 10,
                                   paddingBottom: 10,
                                   backgroundColor: 'green',
                                 flexDirection: 'row',
                                  marginBottom: 20,
                       borderRadius: 5
                                  }}>
                              <Text key={index}>{menFor}</Text>
                               </View>
                            )
                            )
                        }
                  </View>
            }

CodePudding user response：

Set setstorage([newData => [...newData, storage]]); to setstorage(newData => [...newData, storage]);

FYI, the argument to setStorage ie. newData is not the same as the newData array.

Also, you don't need to have a newData global array, smart components have states in them.

CodePudding user response：

I am not sure, about the flow, but here is what I think is causing the error:

setstorage([newData => [...newData, storage]]);

Your newData variable within setstorage overshadows the one in which you are pushing values in the callFunction, you can call setstorage like this:

setstorage([...newData, ...storage]);

Or depending on your use case, you can simply do:

setstorage([...storage, values]);