Question

我如何setState并推送到数组？目前没有任何反应...

这是我的代码

状态

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

裁剪图像

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);

和平面列表

<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

您必须复制imageData数组，而不是将其引用放入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);

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

1 个答案: