Question

我正在使用 Expo 创建一个移动应用程序，并希望将 NativeBase 用于 UI 组件。

无论我尝试做什么，我都会遇到这个烦人的错误：fontFamily "Roboto_medium" is not a system font and has not been loaded through Font.loadAsync

我查看了 docs 并使用了那里的示例，它有效！

import React from 'react';
import { AppLoading } from 'expo';
import { Container, Text } from 'native-base';
import * as Font from 'expo-font';
import { Ionicons } from '@expo/vector-icons';

export default class App extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      isReady: false,
    };
  }

  async componentDidMount() {
    await Font.loadAsync({
      Roboto: require('native-base/Fonts/Roboto.ttf'),
      Roboto_medium: require('native-base/Fonts/Roboto_medium.ttf'),
      ...Ionicons.font,
    });
    this.setState({ isReady: true });
  }

  render() {
    if (!this.state.isReady) {
      return <AppLoading />;
    }

    return (
      <Container>
        <Text>Open up App.js to start working on your app!</Text>
      </Container>
    );
  }
}

请注意它们如何加载 componentDidMount()

中的字体

现在，正如你所看到的，这是旧的 React，我想使用钩子和函数组件。

我试过了：

  useEffect(() => {
    (async () => await Font.loadAsync({
      Roboto: require('native-base/Fonts/Roboto.ttf'),
      Roboto_medium: require('native-base/Fonts/Roboto_medium.ttf'),
    }))();
     }, [])

我试过了：

  useEffect(async() => {
      await Font.loadAsync({
        Roboto: require('native-base/Fonts/Roboto.ttf'),
        Roboto_medium: require('native-base/Fonts/Roboto_medium.ttf'),
        ...Ionicons.font,
      });
  }, [])

没有什么对我有用！有人可以帮忙吗？如何加载这些字体？

React Native / Expo / NativeBase - fontFamily "Roboto_medium" 不是系统字体，还没有通过 Font.loadAsync 加载

0 个答案: