菜鸟教程小白 发表于 2022-12-12 13:34:45

javascript - 为什么不能有两条 AppRegistry.registerComponent 行?


                                            <p><p>我在自学<code>React-Native</code>我遇到了这个奇怪的障碍。在我的里面 <code>App.js</code>我正在尝试导出一个类,然后在我的 <code>App.js</code> 中使用另一个文件在 <code>somePage()</code> 里面功能。我在哪里打电话 <code>&lt;Header/&gt;</code>试图在点击 <code>refresh</code> 时让该文本出现在我的物理设备上. </p>

<p>它显示<code>&lt;Login/&gt;</code>完美,但不是 <code>somePage()</code> 中的内容功能。我的问题是,为什么?</p>

<p>(顺便说一句,我使用的是 <code>Expo</code>,而不是 <code>index.ios.js</code> 文件,而是一个仍然支持跨平台开发的 <code>App.js</code> 文件)。</p>

<p>这是我的 <code>App.js</code>文件:</p>

<pre><code>import React, { Component } from &#39;react&#39;;
import {AppRegistry} from &#39;react-native&#39;;
import Login from &#39;./components/Login&#39;;
import Header from &#39;./components/Header&#39;;

export default class Project extends Component {
    render() {
      return (
            &lt;Login/&gt;
      );
    }
}

const somePage = () =&gt; (
    &lt;Header/&gt;
);

AppRegistry.registerComponent(&#39;someProject&#39;, () =&gt; Project);
AppRegistry.registerComponent(&#39;someProject&#39;, () =&gt; somePage);
</code></pre>

<p>这是我的 <code>Header.js</code>文件:</p>

<pre><code>import React from &#39;react&#39;;
import {Text} from &#39;react-native&#39;;

const Header = () =&gt; {
    return &lt;Text&gt;Testing this out&lt;/Text&gt;
}

export default Header;
</code></pre></p>
                                    <br><hr><h1><strong>Best Answer-推荐答案</ strong></h1><br>
                                            <p><p>react的概念是父组件渲染子组件。您只需注册一次,因为根组件是所有其他组件的父组件。您要渲染的任何其他子组件或孙组件都必须是根组件的后代。作为旁注,您不需要在 <code>Project</code> 组件前面有 <code>export default</code>,因为您没有将它导出到任何地方:您正在下面注册它。 </p>

<p>要修复您的应用,您需要将 header 组件放在已注册的根组件中:</p>

<pre><code>import React, { Component } from &#39;react&#39;;
import {AppRegistry, View } from &#39;react-native&#39;;
import Login from &#39;./components/Login&#39;;
import Header from &#39;./components/Header&#39;;

class Project extends Component {
    render() {
      return (
            &lt;View&gt;
            &lt;Header/&gt;
            &lt;Login/&gt;
            &lt;/View&gt;
      );
    }
}


AppRegistry.registerComponent(&#39;someProject&#39;, () =&gt; Project);
</code></pre></p>
                                   
                                                <p style="font-size: 20px;">关于javascript - 为什么不能有两条 AppRegistry.registerComponent 行?,我们在Stack Overflow上找到一个类似的问题:
                                                        <a href="https://stackoverflow.com/questions/44609520/" rel="noreferrer noopener nofollow" style="color: red;">
                                                                https://stackoverflow.com/questions/44609520/
                                                        </a>
                                                </p>
                                       
页: [1]
查看完整版本: javascript - 为什么不能有两条 AppRegistry.registerComponent 行?