不是系统字体错误,可能与异步相关?

时间:2018-04-11 05:41:02

标签: javascript react-native expo create-react-native-app

所以我得到的“Roboto-Black”不是系统字体,请尝试通过Expo.Font.loadAsync()错误。但我在其他帖子中读到有些人遇到类似的问题,解决办法就是使用await / promise。 但是,我不知道如何使用我的代码,因为我只是按照一个教程来做这个,这是我第一次尝试使用create-react-native-app和最少的JS知识:( 请帮我检查一下这段代码片段,让我知道我做错了什么:

import React, { Component } from 'react';
import { Provider } from 'react-redux';
import { Font, AppLoading } from 'expo';

import Router from 'loginDemo/config/routes.js'
import store from 'loginDemo/redux/store.js';

function cacheFonts(fonts) {
    return fonts.map(function(font) {return Font.loadAsync(font)});
}

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

    async _loadAssetsAsync() {
        const fontAssets = cacheFonts([
            {RobotoBlack: require('loginDemo/assets/fonts/Roboto-Black.ttf')},
            {RobotoBold: require('loginDemo/assets/fonts/Roboto-Bold.ttf')},
            {RobotoMedium: require('loginDemo/assets/fonts/Roboto-Medium.ttf')},
            {RobotoRegular: require('loginDemo/assets/fonts/Roboto-Regular.ttf')},
            {RobotoLight: require('loginDemo/assets/fonts/Roboto-Light.ttf')}
        ]);

        await Promise.all([...fontAssets]);
    }

    render() {
        if (!this.state.isReady) {
            return (
                <AppLoading
                    startAsync={this._loadAssetsAsync}
                    onFinish={() => this.setState({isReady: true})}
                    onError={console.warn}
                 />
            );
        }

        return (
            <Provider store={store}>
                    <Router/>
            </Provider>
        );
   }
}

0 个答案:

没有答案