Question

我无法访问React Native Project IOS中的组件文件夹。

我收到以下错误：

无法解析模块./Login ...... / ReactNative / ReactNativeProject / components / App.js：无法找到此模块在其模块映射或任何node_modules目录中在....... / / ReactNative / ReactNativeProject / components / Login.j及其中父目录。

我参考了以下链接： http://caroaguilar.com/post/react-native-navigation-tutorial/

index.ios.js （ReactNativeProject / index.ios.js）

"use strict";

import React, { AppRegistry } from 'react-native';
import App from './components/App';

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

App.js （ReactNativeProject / components / App.js）

  'use strict'

    import React, {Component} from 'react';
    import {
        AppRegistry,
        StyleSheet,
        NavigatorIOS,
    } from 'react-native';
    var Login = require('./Login');

    class App extends Component {
        render() {
            return (
              <NavigatorIOS
                style={styles.navigationContainer}
                initialRoute={{
                title: "Login Page",
                component: Login,
              }} />
          );
        }
    }

    var styles = StyleSheet.create({
        navigationContainer: {
            flex: 1
        }
    });

    export default App;

Login.js （ReactNativeProject / components / Login.js）

"use strict";
    import React, {Component} from 'react';
    import {
        StyleSheet,
        Text,
        TextInput
    } from 'react-native';
    import Button from 'react-native-button';
    import styles from './login';


    class Login extends Component {

        constructor(props) {
            super(props);
            this.state = {
              username: "",
              password: "",

            };
        }

        render() {
            return (

              <View style={styles.container}>
                  <View style={styles.textContainer}>
                      <TextInput
                          style={styles.inputUsername}
                          placeholder="Enter email ID"
                          value={this.state.username}
                          clearButtonMode = 'while-editing'/>
                      <TextInput
                          style={styles.inputPassword}
                          placeholder="Enter Password"
                          value={this.state.password}
                          password={true}
                          secureTextEntry={true}
                          clearButtonMode = 'while-editing' />

                     <Button style={styles.login}
                             styleDisabled={{color: 'red'}}>
                             Login
                      </Button>
                  </View>
              </View>
            );
        }

    module.exports = Login;

Answer 1

到目前为止，我已经尝试了这个，并为此得到了解决方案。

我在 App.js ：

中犯了一个错误

我已取代dateNY

通过

var Login = require('./Login');

除了App.js

之外，components文件夹下的js文件也发生了如下变化

Login.js中的更改：

import Login from './Login';

更改为

class Login extends Component {
   }

Answer 2

我采用这种方式从整个项目结构的 1个根目录和根目录导入js个文件。

我有以下目录结构。

App.js

上的

root directory个文件 Splash.js

上的

MyApp -> Splash -> Splash.js个文件 Home.js

上的

MyApp -> Home -> Home.js个文件 TextViewComponent

上的

MyApp -> CustomComponents -> TextViewComponent.js个文件

我如何访问所有文件中的所有文件。

希望这对你也有帮助。

完成。

如何从React Native ios项目中的components文件夹访问js文件

2 个答案: