#react-native #google-api
#react-native #google-api
Вопрос:
Файл поиска как вы можете видеть, я делаю запрос get к Google api, но перед отображением этой страницы поиска он уже выдает мне сообщение об ошибке undefined не является объектом (оценка ‘items.volumeInfo’), как если бы я удалил это {result === undefined ? строка null :} и попробуйте запустить код, который даст мне идеальное название первой книги в массиве (как в консоли search().журнал работает отлично) после правильного поиска
import React, {useState, useEffect} from 'react';
import { View, Text } from 'react-native';
import SearchBar from '../components/SearchBar';
import axios from 'axios';
import RenderList from '../components/RenderList';
function SearchScreen() {
const [term, setTerm] = useState("");
const [result, setResult] = useState([]);
const [errorMessage, setErrormessage] = useState("")
const search = async () => {
const res = await axios.get(`https://www.googleapis.com/books/v1/volumes?q=${term}:keyesamp;key=AIzaSyDfYS8u4y8OADwoUIkl0gYOl0SJQ4GLuaA`, {
headers: {
Accept: "application/json",
"Content-Type": "application-json"
}
})
setResult(res.data.items)
console.log(res.data.items[0].volumeInfo.title)
}
return (
<View>
<SearchBar
term={term}
onTermChange={newTerm => setTerm(newTerm)}
onTermSubmit={() => search()}
/>
{result === undefined ? null : <RenderList result={result} />}
</View>
)
}
export default SearchScreen;
Файл рендеринга
import React from 'react';
import { View, Text, StyleSheet, FlatList } from 'react-native';
function RenderList({result}) {
return (
<FlatList
data='result'
renderItem={({items}) => {
return <Text>{items.volumeInfo.title}</Text>
}} />
)
}
export default RenderList
Ответ №1:
Попробуйте вызвать API в useEffect()
useEffect((
apiCall();)=>{},[searchedText])
Не могли бы вы, пожалуйста, показать код панели поиска?