Font error on iOS, Font.loadAsync. How to fix?

Question

Google Fonts

Faced such a problem. The application was tested on Android - everything is fine. Today I started testing on iOS and an error occurred:

fontFamily "Roboto" is not a system font and has not been loaded through Font.loadAsync.
If you intended to use a system font, make sure you typed the name correctly and that it is supported by your device operating system.

I understand that you need to add it as a custom font. I can't figure out where. I'm using the Font.loadAsync function from expo. But the error doesn't go away.
Boot index.js

import {AppRegistry} from 'react-native'
import RootNavigation from './App'
import {name as appName} from './app.json'


AppRegistry.registerComponent(appName, () => RootNavigation)

Then RootNavigation is loaded.

import React from "react";
import { createBottomTabNavigator } from "react-navigation";
import Ionicons from "react-native-vector-icons/Ionicons";
import Feed from "./src/components/screens/Feed/";
import MapScreen from "./src/components/screens/MapScreen/MapScreen";
import Favorite from "./src/components/screens/Favorite/Favorite";
import Search from "./src/components/screens/Search/Search";
import Profile from "./src/components/screens/Profile/Profile";
import { BLUE } from "./constance";

const RootNavigation = createBottomTabNavigator(
  {
    1: Feed,
    2: MapScreen,
    3: Favorite,
    4: Profile,
    5: Search
  },
  {
    navigationOptions: ({ navigation }) => ({
      tabBarIcon: ({ focused, tintColor }) => {
        const { routeName } = navigation.state;
        let iconName;
        if (routeName === "1") {
          iconName = focused ? "ios-star" : "ios-star";
        } else if (routeName === "2") {
          iconName = focused ? "ios-map" : "ios-map";
        } else if (routeName === "3") {
          iconName = focused ? "ios-paper" : "ios-paper";
        } else if (routeName === "4") {
          iconName = focused ? "ios-person" : "ios-person";
        } else if (routeName === "5") {
          iconName = focused ? "ios-search" : "ios-search";
        }
        return <Ionicons name={iconName} size={22} color={tintColor} />;
      }
    }),
    tabBarOptions: {
      activeTintColor: BLUE,
      inactiveTintColor: "gray",
      inactiveBackgroundColor: "#1f1f1f",
      activeBackgroundColor: "#1f1f1f",
      style: {
        elevation: 30,
        backgroundColor: "green",
        borderTopWidth: 1,
        borderTopColor: "#1f1f1f"
      }
    }
  }
);

export default RootNavigation;

I understand where to put this:

import { Font } from 'expo';

    state = {
      fontLoaded: false,
    };

    componentDidMount() {
        Font.loadAsync({
          'Roboto': require('./assets/fonts/Roboto.ttf'),
        });
      }

But I don't understand where. Help please with a problem.