将 ImageView 组件放入 View 组件时出错答案

【问题标题】：Error in putting ImageView component within View component将 ImageView 组件放入 View 组件时出错
【发布时间】：2021-12-27 07:45:34
【问题描述】：

当我将 ImageView 组件放入 View 组件时，我收到错误消息：错误：必须在组件内呈现文本字符串。我不明白这里出了什么问题。下面是代码sn-p：

import React from 'react';
import { View, Image, ScrollView, TouchableOpacity, Modal, Text } from 'react-native';
import styles from './cameraStyles';
import ImageView from "react-native-image-viewing";

export default ({captures=[], lflagImage=false}) => {
    const [flagImage, setflagImage] = React.useState(lflagImage);
    return (
        <ScrollView horizontal={true} style={[styles.bottomToolbar, styles.galleryContainer]}>
            {captures.map(({ uri }) => (
                <View style={styles.galleryImageContainer} key={uri}>
                    <TouchableOpacity onPress={()=> {setflagImage(prevData => !prevData)}}>
                        <Image source={{ uri }} style={styles.galleryImage}/>                       
                    </TouchableOpacity>
                    <ImageView
                        images={captures}
                        imageIndex={0}
                        visible={flagImage}
                        onRequestClose={() => setflagImage(prevData => !prevData)}
                    />
                </View>
            ))}
        </ScrollView>
    )
}

【问题讨论】：

标签： javascript react-native expo

【解决方案1】：

看起来您在 TouchableOpacity 的 onPress 事件中有一组额外的大括号。应该是：

onPress={()=> setflagImage(prevData => !prevData)}

这可能会导致您遇到的问题。

我也看不到 style.galleryImage 是什么，但请确保您定义了高度和宽度，否则无论如何它都不会显示。

【讨论】：