Почему реагируют значения собственных переменных в то время как в l oop и при прикосновении к прессе? - PullRequest
0 голосов
/ 03 марта 2020

Я создаю новостное приложение, которое извлекает и отображает данные, я выбираю json массив данных и затем передаю эти данные для создания l oop. Мои другие вещи работают нормально, создавая изображения и заголовок и нажимая на них с данными в al oop, а затем помещая их в массив. Но для текущей функции это не работает, как ожидалось. Проблема в том, что данные корректно передаются в представления, и я могу правильно видеть изображения и заголовки, но когда я касаюсь их, чтобы открыть страницу новостей, передав параметр, он открывает другие новости, кроме себя. Я обнаружил, что, пока l oop работает, значение указателя является правильным, но когда я касаюсь, значение указателя отличается, и поэтому идентификатор также отличается.

В этой функции я делаю создание сетки миниатюр с петлями. Я получаю значение указателя равным 3 при касании, и в соответствии с этим он открывает правильные новости. Но почему правильные новости не открываются с помощью правильного указателя? Пожалуйста, помогите.

getPostGridView(params = "") {
    let data = this.state.getPostGridViewData;
    if (!data) {
        this.getPostGridViewData(params);
        return null;
    } else {
        console.log("Data in state =>" + JSON.stringify(this.state.getPostGridViewData));
        let gridRowCount = parseInt(data.length / 3);
        let items = [];
        let rowItems = [];

        if (gridRowCount > 0) {
            items.push(
                <View key={-1} style={{ alignSelf: "flex-start", marginBottom: 10 }}>
                    <Text style={{ fontFamily: "Oswald-Regular", fontSize: 16, color: "rgb(1,29,66)", paddingHorizontal: 10, paddingTop: 5, alignSelf: "flex-start" }}>Health & Politics</Text>
                    <View style={{ width: 15, height: 2, backgroundColor: "red", alignSelf: 'flex-start', marginLeft: 10 }}></View>
                </View>
            );

            for (let i = 0, pointer = 0; i < gridRowCount; i++) {
                rowItems = [];
                id = null;
                for (let j = 0; j < 3 && pointer < data.length; ++pointer, j++) {
                    console.log("pointer value in loop " + pointer);
                    rowItems.push(
                        <View key={j} style={[styles.itemContainer, { width: 100, height: 130, marginHorizontal: 10, borderRadius: 10 }]}>
                            <TouchableOpacity onPress={() => {
                                console.log("pointer value in touch " + pointer);
                                console.log("id value in touch " + data[pointer].id);
                                this.props.navigation.navigate('NewsPageScreen', { 'id': data[pointer].id });
                            }}>

                                <ImageBackground source={{ uri: data[pointer].jetpack_featured_media_url.split("?")[0] }} style={{ width: "100%", height: 130, justifyContent: "flex-end" }} imageStyle={{ borderRadius: 10 }}>
                                    <LinearGradient colors={['transparent', 'black']} start={[1, 0]} end={[1, 1]}
                                        style={{ minHeight: 120, justifyContent: "flex-end", borderBottomLeftRadius: 10, borderBottomRightRadius: 10 }} >
                                        <View style={{ padding: 5, paddingTop: 10 }}>
                                            <HTML baseFontStyle={{ fontFamily: "Oswald-Regular", fontSize: 10, color: "white" }} html={data[pointer].title.rendered} />
                                        </View>
                                    </LinearGradient>
                                </ImageBackground>

                            </TouchableOpacity>
                        </View>
                    );
                }
                items.push(<View key={i} style={{ flexDirection: "row" }}>{rowItems}</View>);
            }

        } else {
            items = null;
        }

        return items;
    }

}
...