Data's not displaying while fetching from API and using Flatlist in react native-CodePudding

Here is My code Iam Using an API and fetching the data from it...If iam console it means it works properly but it does'nt display it while using FlatList

import { View, Text,FlatList,Button,TouchableOpacity} from 'react-native'; import React,{useState,useEffect} from 'react';

const LyricsGet = () => {

const url = "https://api.lyrics.ovh/v1/Sia/unstoppable";

 const[lyric,setLyric]=useState([]);

Fetching the data using useEffect

useEffect(() => {

    console.log("inside the useeffect");

    fetch(url)
      .then(response => response.json())
      .then(results => {
        console.log(results);
        setLyric(results);
      })
      .catch(err => {
        setError(err);
      });
   
      console.log("inside the useeffect 22222");

  }, []);
return (
    <View>
      <FlatList
            data={lyric}
            renderItem={({ item }) => <Text key={item._id}>{item.lyrics}</Text>}
            keyExtractor={item => item.id}
          />
</View>
  );
}

Here My console

Object { "lyrics": "I'll smile, I know what it takes to fool this town I'll do it 'til the sun goes down and all through the night time Oh yeah Oh yeah, I'll tell you what you wanna hear Leave my sunglasses on while I shed a tear It's never the right time, yeah, yeah

I put my armor on, show you how strong I am

I put my armor on, I'll show you that I am

I'm unstoppable

I'm a Porsche with no brakes

I'm invincible

Yeah, I win every single game

I'm so powerful

I don't need batteries to play

I'm so confident

Yeah, I'm unstoppable today

Unstoppable today, unstoppable today

Unstoppable today, I'm unstoppable today

Break down, only alone I will cry out now

You'll never see what's hiding out

Hiding out deep down, yeah, yeah

I know, I've heard that to let your feelings show

Is the only way to make friendships grow

But I'm too afraid now, yeah, yeah

I put my armor on, show you how strong I am

I put my armor on, I'll show you that I am

I'm unstoppable

I'm a Porsche with no brakes

I'm invincible

Yeah, I win every single game

I'm so powerful

I don't need batteries to play

I'm so confident

Yeah, I'm unstoppable today

Unstoppable today, unstoppable today

Unstoppable today, I'm unstoppable today

Unstoppable today, unstoppable today

Unstoppable today, I'm unstoppable today

I put my armor on, show you how strong I am

I put my armor on, I'll show you that I am

I'm unstoppable

I'm a Porsche with no brakes

I'm invincible

Yeah, I win every single game

I'm so powerful

I don't need batteries to play

I'm so confident

Yeah, I'm unstoppable today

Unstoppable today, unstoppable today

Unstoppable today, I'm unstoppable today

Unstoppable today, unstoppable today

Unstoppable today, I'm unstoppable today", }

CodePudding user response：

Your results variable is an object.

You could achieve what you want by creating an array when setting the lyrics:

setLyric([results]);

CodePudding user response：

Your data you get from useState lyric.. is an object right? FlatList needs an array.