Блог

Главная - Вопросы по программированию - Я возвращаю рендеринг, но проблема сохраняется

Я возвращаю рендеринг, но проблема сохраняется

#javascript #reactjs #react-native

#javascript #reactjs #реагировать — родной

Вопрос:

Привет, я относительно новичок в React Native. В любом случае моя проблема в том, что я пытаюсь изменить шрифт своего текста и хочу убедиться, что после загрузки шрифтов я хочу, чтобы экран загрузки заканчивался.

Тем не менее, я получаю эту ошибку :

Ошибка: приложение (…): из рендеринга ничего не было возвращено. Обычно это означает, что оператор return отсутствует. Или, чтобы ничего не отображать, верните null .

Эта ошибка находится по адресу: в приложении (созданном ExpoRoot) в ExpoRoot (в renderApplication.js:45) в RCTView (в View.js:34) в View (в AppContainer.js: 106) в DevAppContainer (в AppContainer.js: 121) в RCTView (в View.js: 34) в представлении (в AppContainer.js: 132) в AppContainer (в renderApplication.js:39)

Это мой App.js

 import { StatusBar } from 'expo-status-bar';
import React from 'react';
import { render } from 'react-dom';
import { Button, StyleSheet, Text, View } from 'react-native';
import AppNavigator from './src/navigation/Navigator';
import * as Font from 'expo-font';
import {AppLoading} from 'expo-app-loading';

export default class App extends React.Component {
  state = {
    isFontLoaded : false
  }

  async componentDidMount(){
    await Font.loadAsync({
      "SemiBold" : require('./src/fonts/Montserrat-Regular.ttf'),
      "Medium" : require('./src/fonts/Montserrat-Medium.ttf'),
      "Regular" : require('./src/fonts/Montserrat-Regular.ttf')
    });
    this.setState({isFontLoaded:true})
  }

 render(){

   return (
     (this.state.isFontLoaded === true) ? (<AppNavigator/>):(AppLoading)
   // AppLoading
   );
 }

}

Если вам что-нибудь еще потребуется, пожалуйста, дайте мне знать.

Заранее спасибо.

Комментарии:

1. Является AppLoading ли элемент JSX? Если это так, то его следует обернуть <AppLoading />

2. @choz Я уже пробовал это, и я получаю следующую ошибку:

3. Ошибка @choz: недопустимый тип элемента: ожидалась строка (для встроенных компонентов) или класс / функция (для составных компонентов), но получено: не определено. Вероятно, вы забыли экспортировать свой компонент из файла, в котором он определен, или вы могли перепутать импорт по умолчанию и именованный импорт. Проверьте метод рендеринга App .

4. Затем проверьте свой expo-app-loading файл или, по крайней мере, опубликуйте его здесь.

5. expo-app-loading — это библиотека, и что именно я должен искать?

Ответ №1:

Импортируйте следующим образом, например

 import AppLoading from 'expo-app-loading'; // this way

render(){

  if(!this.state.isFontLoaded){
    return <AppLoading />
  }

  return <AppNavigator />
}

Комментарии:

1. Однако спасибо за ответ, я получаю эту ошибку сейчас: недопустимый тип элемента: ожидал строку (для встроенных компонентов) или класс / функцию (для составных компонентов), но получил: не определено. Вероятно, вы забыли экспортировать свой компонент из файла, в котором он определен, или вы могли перепутать импорт по умолчанию и именованный импорт. Проверьте метод рендеринга App .

2. Эта ошибка обычно возникает, когда у нее недопустимый импорт. Проверьте свой импорт import AppNavigator from './src/navigation/Navigator'; и import {AppLoading} from 'expo-app-loading';

3. Эй, итак, я провел некоторое исследование, и я думаю, что правильный способ импорта загрузки приложений заключается в следующем : AppNavigator работает отлично, так как без загрузки приложения приложение работает должным образом. Однако теперь я получаю эту ошибку с обновленным импортом для загрузки приложения: «Предупреждение: не удается выполнить обновление состояния реакции для размонтированного компонента. Это не операция, но это указывает на утечку памяти в вашем приложении. Чтобы исправить, отмените все подписки и асинхронные задачи в методе componentWillUnmount .’