I am trying to get list of videos with title, upload, date, views, likes, dislikes, comments but I cannot read properties of undefined (reading 'viewCount') as runtime error.
const YouTubeSearch = () => {
const [keyword, setKeyword] = useState("");
const [searchResults, setSearchResults] = useState([]);
const handleSubmit = async (event) => {
event.preventDefault();
try {
const response = await axios.get(
`https://www.googleapis.com/youtube/v3/search`,
{
params: {
part: ["snippet","statistics"],
q: keyword,
type: "video",
maxResults: 25,
key: 'youtubeKey',
},
}
);
setSearchResults(response.data.items);
} catch (error) {
console.error("Error fetching data from YouTube API:", error);
}
};
const renderSearchResults = () => {
return (
searchResults.map((item) => (
<tr key={item.id}>
<td>{item.snippet.title}</td>
<td>{item.snippet.publishedAt}</td>
<td>{item.statistics.viewCount}</td>
<td>{item.statistics.likeCount}</td>
<td>{item.statistics.dislikeCount}</td>
<td>{item.statistics.commentCount}</td>
</tr>
))
);
};
Runtime Error -> Cannot read properties of undefined (reading 'viewCount')
How to solve this? How to get viewCount, likeCount, dislikeCount, commentCount?