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

问题

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?

回答1:

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

来源：https://stackoverflow.com/questions/52069960/console-error-fontfamily-helvetica-neue-is-not-a-system-font-and-has-not-bee

标签

react-native