I created a new React Native CLI project and was thinking to convert the App component to a class based component to fix a hot reload issue when using react-navigation.
But I don't understand the logic with these two arrow functions, and how to convert it:
const App: () => React$Node = () => {
return <NavigationWrapper />;
};
Update: the arrow question was answered, though it didn´t help for the hot reload issue (a glitch in my logic there). See this link for a solution for that.
First, be very careful when reading this code. It looks like two arrow functions, but actually the second 'arrow function' is the type annotation of App
. So it's the same as this:
const App: (() => React$Node) = () => {
return <NavigationWrapper />;
};
or even clearer:
const App = (): React$Node => {
return <NavigationWrapper />;
};
Then, remember that arrow functions are just like regular functions, so this can be written like so:
function App(): React$Node {
return <NavigationWrapper />;
};
So now it becomes pretty clear how this might look:
class App {
render(): React$Node {
return <NavigationWrapper />;
}
}