如何使用索引。js(index.ios代替。在对跨平台应用程序的响应中?

Thanks for the answers from now,

谢谢你现在的回答，

I am a newbie in React Native, I want to make a cross-platform app so I created index.js:

我是React Native的新手，我想做一个跨平台的应用，所以我创建了index.js:

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

class ReactApp extends Component {

    render() {
        return (
            <View><Text>Hello world</Text></View>
        );
    }
}

module.exports = ReactApp;

Then I imported index.js from both index.ios.js and index.android.js like this:

然后我进口指数。index.ios js。js和index.android。js是这样的:

import { AppRegistry } from 'react-native';
import ReactApp from './index';

AppRegistry.registerComponent('ReactApp', () => ReactApp);

I think after this it should work but I get this error:

我认为在这之后它应该会起作用，但是我得到了这个错误:

2 个解决方案

#1

After React v0.49, you don't need index.ios.js and index.android.js. You only need the index.js:

在反应v0.49之后，您不需要index.ios。js和index.android.js。你只需要索引。js:

import {AppRegistry} from 'react-native';
import App from './app/App';

AppRegistry.registerComponent('appMobile', () => App);

(replace appMobile with the name of your app)

(用app名称替换appMobile)

Source: (https://github.com/facebook/react-native/releases/tag/v0.49.0)

来源:(https://github.com/facebook/react-native/releases/tag/v0.49.0)

New projects have a single entry-point (index.js) from now on

从现在开始，新的项目有一个入口点(index.js)。

#2

You're going about this backwards. index.ios.js and index.android.js will always be separate entry points in a default react-native init project. If you want to have them run the same codebase via index.js, you should set it up so index.ios.js and index.android.js import index.js and registers the same base component as defined in index.js.

你把这个倒过来。index.ios。js和index.android。js将永远是默认的、本地的init项目中的独立入口点。如果您想让它们通过索引运行相同的代码基。js，你应该设置成index.ios。js和index.android。js进口指数。并注册与index.js中定义的相同的基组件。

For example, you can look at how it's done in this example ToDo app (Github repo here).

例如，您可以查看这个示例中的ToDo应用程序(Github repo)是如何完成的。

If you place index.js in your root folder, it will conflict with index.android.js and index.ios.js when you don't reference it directly. So you will need to point to the exact path in your import. See the code below.

如果你把索引。在根文件夹中，它将与index.android发生冲突。js和index.ios。当你不直接引用它时。因此，您需要指出导入中的确切路径。请参见下面的代码。

index.ios.js and index.android.js (same contents)

index.ios。js和index.android。js(相同内容)

import React from 'react';
import { AppRegistry } from 'react-native'
import ReactApp from './index.js'
// Had you placed index.js in another folder like `./app`, you could instead do your import with this shorthand:
// import ReactApp from './app'

AppRegistry.registerComponent('ReactApp', () => ReactApp)

index.js

index.js

// Note: I noticed that you imported Component from the wrong place. That might also be contributing to your issue so I fixed it here.
import React, { Component } from 'react';
import {
    View,
    Text,
} from 'react-native';

// Unless you are exporting multiple things from a single file, you should just use this.
// It's more idiomatic than using module.exports = ReactApp;
export default class ReactApp extends Component {
    render() {
        return (
            <View><Text>Hello world</Text></View>
        );
    }
}

#1