0
290
Viewswhy content in console.log is printed infinite time in react native return statement
I am new to React Native, I just want to check the console.log statement inside the return statement of a function but when I check the console the contents of console.log is printing infinitely in the console tab. can anyone explain why this is happening? Below is the code I am checking with, Thanks in advance.
import * as React from'react';
import { Text, View } from 'react-native';
function ExportFile() {
var RNFS = require('react-native-fs');
return (
<View>
<Text>
ExportFile
{
console.log("hello")
}
</Text>
</View>
);
}
export default ExportFile;
Below is my console output.
·
Santiago Trujillo
1 answers
Answer question0
this is because the component keeps re-rendering. Every time it re-renders the statement is logged again. You should move the console.log to useEffect preferably. Something like:
import * as React from'react';
import { Text, View } from 'react-native';
function ExportFile() {
//only call console.log on component mount
React.useEffect(()=>{
console.log("hello")
},[])
var RNFS = require('react-native-fs');
return (
<View>
<Text>
ExportFile
</Text>
</View>
);
}
export default ExportFile;This will only console.log on the component mount. You can add dependencies to the useEffect of course to log on basis of a dependency change. For more info, check out official docs: https://reactjs.org/docs/hooks-effect.html
·
Santiago Trujillo
Report
Answer question