console.error: "fontFamily 'Helvetica Neue' 不是系统字体，还没有通过 Expo.Font.loadAsync 加载 [英] console.error: "fontFamily 'Helvetica Neue' is not a system font and has not been loaded through Expo.Font.loadAsync

问题描述

在我的 react-native 应用程序中，我为事件日历添加了一个包

解决方案

可以通过expo添加字体

从 'react' 导入 Reactimport { AppLoading, Asset, Font, Icon } from 'expo'从 './navigation/AppNavigator' 导入 AppNavigator导出默认类 App 扩展 React.Component {状态 ={字体加载:false}异步 componentDidMount() {等待 Font.loadAsync({lato: 需要('./assets/fonts/Lato.ttf'),'lato-bold': require('./assets/fonts/LatoBold.ttf'),});this.setState({ fontLoaded: true });}使成为() {const {fontLoaded} = this.state返回 (<React.Fragment><Text style={{fontFamily: 'lato'}}>字体测试</Text></React.Fragment>)}else{return 正在加载....}}}

如果你更详细的访问网址https://docs.expo.io/versions/latest/guides/using-custom-fonts/

fonts 文件夹应该在你过去的 assets > fonts 文件夹中 Lato.ttf 字体

In my react-native app i have added a package for event calendar Package link. Which gives me an error message

console.error: "fontFamily 'Helvetica Neue' is not a system font and has not been loaded through Expo.Font.loadAsync.

App.js

import React from 'react';
import { StyleSheet, Text, View, Dimensions, StatusBar } from 'react-native';
import Header from 'react-native';
import { WelcomeScreen } from './screens/WelcomeScreen';
import EventCalendar from 'react-native-events-calendar';

let { width } = Dimensions.get('window');
export default class App extends React.Component {
constructor(props) {
  super(props);
  this.state = {
  events: [
    {
      start: '2017-09-06 22:30:00',
      end: '2017-09-06 23:30:00',
      title: 'Dr. Mariana Joseph',
      summary: '3412 Piedmont Rd NE, GA 3032',
      color: 'green'
    } ]
  };
 }
_eventTapped(event) {
 alert(JSON.stringify(event));
 }

render() {
return (
  <View style={{ flex: 1, marginTop: 20 }}>
    <EventCalendar
      eventTapped={this._eventTapped.bind(this)}
      events={this.state.events}
      width={width}
      initDate={'2017-09-07'}
      scrollToFirst
      upperCaseHeader
      uppercase
      scrollToFirst={false}
     />
    </View>
    );
    }
  }

What is the solution for the problem?

解决方案

you can add font by expo

import React from 'react'
import { AppLoading, Asset, Font, Icon } from 'expo'
import AppNavigator from './navigation/AppNavigator'
export default class App extends React.Component {
state ={
   fontLoaded: false 
}
async componentDidMount() {
 await  Font.loadAsync({
 lato: require('./assets/fonts/Lato.ttf'),
'lato-bold': require('./assets/fonts/LatoBold.ttf'),
  });
 this.setState({ fontLoaded: true });
 }
render() {
const {fontLoaded} = this.state
return (    
    <React.Fragment><Text style={{fontFamily: 'lato'}}>font test</Text></React.Fragment>
)}
   else{return <Text>Loading....</Text>}
  }}

if you more detail visit url https://docs.expo.io/versions/latest/guides/using-custom-fonts/

fonts folder should be on assets > fonts folder inside past you Lato.ttf font

这篇关于console.error: "fontFamily 'Helvetica Neue' 不是系统字体，还没有通过 Expo.Font.loadAsync 加载的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！