为什么你不能有两个AppRegistry.registerComponent行？

我在教我自己React-Native我遇到了这个奇怪的路障。在我的App.js里面，我试图导出一个类，然后使用函数中的App.js内的另一个文件。我打电话给<Header/>，试图在打到refresh时在我的物理设备上显示该文本。为什么你不能有两个AppRegistry.registerComponent行？

它完美显示<Login/>，但不包含somePage()函数中的内容。我的问题是，为什么？

（我使用Expo的方式，而不是index.ios.js文件这是一个App.js文件，仍然支持跨平台开发）。

这是我的App.js文件：

import React, { Component } from 'react'; 
import {AppRegistry} from 'react-native'; 
import Login from './components/Login'; 
import Header from './components/Header'; 

export default class Project extends Component { 
    render() { 
     return (
      <Login/> 
     ); 
    } 
} 

const somePage =() => (
    <Header/> 
); 

AppRegistry.registerComponent('someProject',() => Project); 
AppRegistry.registerComponent('someProject',() => somePage);

这是我的Header.js文件：

import React from 'react'; 
import {Text} from 'react-native'; 

const Header =() => { 
    return <Text>Testing this out</Text> 
} 

export default Header;

来源

2017-06-17 van jok

的反应的概念是，一个父组件呈现子组件。您只需要注册一次，因为根组件是所有其他组件的父组件。您要呈现的任何其他子组件或孙组件都必须是根组件的后代。作为附注，您不需要在Project组件前面有export default，因为您不会将其导出到任何位置：您正在下面注册它。

要解决您的应用程序，你需要将头组件放置注册根组件内：

import React, { Component } from 'react'; 
import {AppRegistry, View } from 'react-native'; 
import Login from './components/Login'; 
import Header from './components/Header'; 

class Project extends Component { 
    render() { 
     return (
      <View> 
       <Header/> 
       <Login/> 
      </View> 
     ); 
    } 
} 


AppRegistry.registerComponent('someProject',() => Project);

来源

2017-06-17 21:56:22

其实，等待。我需要'导出默认类'为了您的代码工作。否则，我收到一个错误。 –

如果您在其他地方使用项目组件，则需要导出它。如果那是真的，那么你没有提供必要的代码来帮助你。不是我的错。 –

我的猜测是你正在使用这个相同的组件注册Android和iOS。在这种情况下，您需要在另一个目录中需要它。但是，你再也没有提到你的问题，所以我无法知道。没有足够的理由不接受我的回答，因为我的回答确实解决了您提出的问题。 –

为什么你不能有两个AppRegistry.registerComponent行？

回答

相关问题