¿Cómo navego desde los resultados de búsqueda de Algolia a una página específica?
¿Cómo puedo navegar hacia los resultados de búsqueda mostrados por Algolia?
¿Tengo que darle a cada elemento (en este caso 15 artículos diferentes) una clave diferente?
Solo puedo entender cómo hacer que navegue hacia un artículo específico, y no hacia un artículo basado en el resultado de búsqueda que se haya hecho clic.
import React from 'react';
import { StyleSheet, Text, View, FlatList, TouchableOpacity } from 'react-native';
import { connectInfiniteHits } from 'react-instantsearch-native';
import PropTypes from 'prop-types';
import { useNavigation } from '@react-navigation/native';
const InfiniteHits = ({ hits, hasMore, refineNext, }) => {
const navigation = useNavigation()
return(
<view style="{styles.container}">
<flatlist data="{hits}" numcolumns="{2}" keyextractor="{item" ==""> item.objectID}
onEndReached={() => hasMore && refineNext()}
renderItem={({ item }, index) => (
<touchableopacity onpress="{()" ==""> navigation.navigate('Artículos',{item})}
style={styles.item}>
<view style="{TextBoxes.scrollcontainer}">
<view style="{TextBoxes.boxes}" key="{index}">
<text key="{index}" style="{TextBoxes.style}" hit="{item}">
{item.title}
</text>
</view>
</view>
</touchableopacity>
)}
/>
</flatlist></view>
)
};
InfiniteHits.propTypes = {
hits: PropTypes.arrayOf(PropTypes.object).isRequired,
hasMore: PropTypes.bool.isRequired,
refineNext: PropTypes.func.isRequired,
};
export default connectInfiniteHits(InfiniteHits);
davy.ai
Para navegar a los resultados de búsqueda mostrados por Algolia, puedes utilizar el gancho
useNavigation
del paquete@react-navigation/native
y pasar el resultado de la búsqueda como una propiedad a la pantalla objetivo utilizando el métodonavigation.navigate
.En el fragmento de código proporcionado, el método
onPress
en el componenteTouchableOpacity
es responsable de navegar a la pantalla objetivo. El objetoitem
(que contiene los detalles del resultado de búsqueda específico en el que se hizo clic) se pasa como una propiedad a la pantalla objetivo utilizando el métodonavigation.navigate
:En cuanto a la pregunta sobre dar a cada elemento una clave diferente, no es necesario dar a cada elemento una clave diferente en este caso, ya que la propiedad
keyExtractor
ya se está utilizando para extraer elobjectID
de cada elemento como clave. Este es un identificador único para cada elemento y se recomienda utilizarlo como clave en lugar del índice del arreglo.