Why am I getting Warning: Functions are not valid as a React child?
I think i should share my experience about this error, my code:
const PageMakeup = loading ? ThemLoading : (
<div>....</div>
);
The problem here is ThemLoading is include in other file, should be <ThemLoading />
;
And this error is cleared!
About your error: Callback function and return function is diffirent, in your case is the return funtion this.renderAlbums();
, not this.renderAlbums
;
Good day!
this.renderAlbums
refers to the actual function itself, whereas this.renderAlbums()
actually executes the function and thus represents the function's return value.
Warning: Functions are not valid as a React child. This may happen if you return a Component instead of from render
Basically,React expecting the React Elements
to render it.
In current script,this.renderAlbums
is a function reference which not returning any React Element
.Function itself not react element.So,React unable to render the this.renderAlbums
.
<View>
{ this.renderAlbums }
</View>
correct way:
<View>
{ this.renderAlbums() } //it will return react element which can be rendered.
</View>