如何设置状态并将对象推送到数组？

Question

How can I setState and push to an array? Currently nothing happens...

This is my code

State

const [imageData, setImageData] = useState([]);

crop image

const choosePicture = () => {
    ImagePicker.openPicker({
        width: 300,
        height: 400,
        cropping: true,
    })
        .then(image => {
            onSelectedImage(image);
        })
        .catch(error => {
            console.log(error);
        });
};

setState

const onSelectedImage = image => {
    let newDataImg = imageData;

    let item = {
        id: Date.now(),
        url: image.path,
    };

    newDataImg.push(item);
    setImageData(newDataImg);
};
console.log(imageData);

And Flatlist

<FlatList
    data={imageData}
    renderItem={itemData => (
        <View>
            <Image
                source={{uri: itemData.item.url}}
                style={{width: 200, height: 200}}
            />
        </View>
    )}
    keyExtractor={item => item.id.toString()}
/>

Answer 1

You must copy your imageData array instead of putting its refernce into newDataImg.

const onSelectedImage = image => {
    // Copy the array
    let newDataImg = [...imageData];

    let item = {
      id: Date.now(),
      url: image.path,
    };

    newDataImg.push(item);
    setImageData(newDataImg);
  };
  console.log(imageData);