Question

我使用GridView显示多个产品，点击后我想转到详细信息屏幕，但是我无法找到识别用户选择/点击的产品网格视图单元的方法，我想发送一些参数处理方法应该做的伎俩。

return (

            <GridView
                itemDimension={130}
                items={this.state.dataSource}
                style={styles.gridView}
                renderItem={item => (
                    <View style={styles.itemContainer}>
                        <TouchableOpacity onPress={ this.onPressStone } style={styles.itemContainer}>
                            <Image source = {{uri:item.url}} style={styles.imageView} />
                            <Text style={styles.itemName}>{item.name}</Text>
                        </TouchableOpacity>
                    </View>
                )}
            />
);

Answer 1

您可以像上述那样向您的函数发送参数。

示例

onPress={ () => this.onPressStone(item.id) }

Answer 2

您可以将项目传递给onStressStone上的方法，并根据您可以执行的项目打印您想要的内容。如果您想知道谁被按下了，您只需要使用项目名称创建日志或以索引为例

return (

        <GridView
            itemDimension={130}
            items={this.state.dataSource}
            style={styles.gridView}
            renderItem={(item, index) => {
             //to know who was pressed:
             console.log('pressedItemName-->', item.name);
             //to know index pressed:
             console.log('pressedItemName-->', item);
              return (
                <View style={styles.itemContainer}>
                    <TouchableOpacity onPress={ ()=> {this.onPressStone(item)} } style={styles.itemContainer}>
                        <Image source = {{uri:item.url}} style={styles.imageView} />
                        <Text style={styles.itemName}>{item.name}</Text>
                    </TouchableOpacity>
                </View>
            )}
        />

）;

使用具有多个TouchableOpacity的相同onPress句柄

2 个答案: