将home.js导入react-native app.js失败,并出现错误,无法解析home.js

问题描述 投票:0回答:1

我正在通过导入将screen文件夹中的screens/home.js home.js文件构建为本机应用程序从./screens/home.js导入Home;在App.js中IAM使用EXPO CLI当我运行expo start --web发生错误无法解决./screens/home.js。我确定路径和文件名。可能是什么问题

enter code hereApp.js

import React ,{useState}from 'react';
//import { View, Text } from 'react-native';
import Home from './screens/home';
import * as font from 'expo-font';
import {AppLoaded} from 'expo';

const getFonts=()=>{
  return Font.loadASync({
   'nunito-regular':require('./assets/fonts/Nunito-Regular.ttf'),
   'nunito-bold':require('./assets/fonts/Nunito-Bold.ttf'),
  })

}

export default function App() {
  const [fontsLoaded,setFontsLoaded]=useState(false);  
   if(fontsLoaded){
      return(
        <Home/>
      );
    }
    else{
      return(
        < AppLoaded 
        startASync={getFonts}
        onFinish={()=>setFontsLoaded(true)}
        />
      )
    }
}

screens/home.js
import React from 'react';
import { StyleSheet, Text, View } from 'react-native';
import { render } from 'react-dom';

export default function Home() {
  render(){
     return (
        <View style={styles.container}>
            <Text style={styles.titleText}>Home Screen</Text>
         </View> 
  );
}
}
const styles = StyleSheet.create({
  container: {
    padding:24,
  },
  titleText:{
    fontFamily:'nunito-bold',
    fontSize:18,
  }
});
react-native screen custom-font
1个回答
0
投票

从主屏幕上删除渲染方法对代码进行了一些更改,尝试执行以下操作:

import React ,{useState}from 'react';
//import { View, Text } from 'react-native';
import Home from './screens/Home';
import * as font from 'expo-font';
import {AppLoaded} from 'expo';


export default function App() {
    return(
        <Home/>
    ) 
}

和home.js到

import React from 'react';
import { StyleSheet, Text, View } from 'react-native';


export default function Home() {

     return (
        <View style={{justifyContent:"center",alignItems:"center",flex:1}}>
            <Text >Home Screen</Text>
         </View> 
  );
}

希望这会有所帮助!

© www.soinside.com 2019 - 2024. All rights reserved.