CODEWITHSUNDEEP
javascriptreactjsjsonreact-native
Zeke
Zeke

Reputation: 117

Flatlist got error message said Nothing was returned from render

how can I solve this problem, I'm facing an error that said

Nothing was returned from render. This usually means a return statement is missing. Or, to render nothing, return null.

when I want to show my JSON file in my screen of List (CurrenciesList.js) the code is here

import React from 'react' 
import { FlatList, View } from 'react-native'
import RowItem from '../../components/RowItem'
import currencies from '../../data/currencies.json'

export default () => {
    <View>
        <FlatList 
            data={currencies} 
            renderItem={({item}) => {
                return <RowItem title={item}/>
            }} />
    </View>
}

RowItem is the reusable component and it's passing a text param only.

const RowItem = ({title, onPress}) => {
    return (
        <TouchableOpacity onPress={onPress}>
            <Text style={styles.title}>{title}</Text>
        </TouchableOpacity>
    )
}

export default RowItem

and my file JSON (currencies.json) is like this

[
    "AUD",
    "BGN",
    "BRL",
    "CAD",
    "CHF",
    "CNY",
    "CZK",
    "etc.."
  ]

Upvotes: 0

Views: 66

Answers (2)

Shivam
Shivam

Reputation: 2339

You can try this,

import React from 'react' 
import { FlatList, View } from 'react-native'
import RowItem from '../../components/RowItem'
import currencies from '../../data/currencies.json'

export default () => {
return (
    <View>
        <FlatList 
            data={currencies} 
            renderItem={({item}) => {
                return <RowItem title={item}/>
            }} />
    </View>
);
}

Upvotes: 2

ABDULLOKH MUKHAMMADJONOV
ABDULLOKH MUKHAMMADJONOV

Reputation: 5234

Your function does not return anything

change

export default () => {
    <View>

    </View>
}

to:

export default () => {
    return <View>
      ...
    </View>
}

or to

// no curly braces
export default () =>
    <View>
     ...
    </View>

Upvotes: 2

Related Questions