如何在snack.expo.io中导入/导出js文件

时间:2018-02-23 15:27:33

标签: javascript react-native expo

请我是新来回应当地人,我正在开发关于snack.expo.io的项目 他们似乎很好,但我希望将js(component1.js)文件连接到父App.js文件,但它一直给我这些错误。

  

设备:(1069:6932)无法安装模块'/ component1':无法下载模块'~component1 @ latest'    从App.js导入

这是我的App.js文件:

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

// You can import from local files

// or any pure javascript modules available in npm

export default class App extends React.Component {
  render() {
    return (
      <View style={styles.container}>
        <Component1 />
      </View>
    );
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    alignItems: 'center',
    justifyContent: 'center',
    backgroundColor: '#ecf0f1',
  },
});

我想从我的“component1.js”得到我的结果,如下所示:

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

export default class Component1 extends Component {
  addRow= ()=>{
    alert("Chat Unavailable");
  }
  render() {
    return (
      <View style={styles.part}>
      <TouchableOpacity style={styles.btn} onPress={this.addRow}>
        <Text style={styles.plus}>
          +
        </Text>
        </TouchableOpacity>
      </View>
    );
  }
}

const styles = StyleSheet.create({
  part: {
    flex: 1,
    alignItems: 'center',
    justifyContent: 'center',
  },
  btn: {
    position: 'absolute',
    width:50,height:50,
    backgroundColor:'#00FF00',
    borderRadius:50,
    bottom:10,right:10,
    alignItems:'center',
    justifyContent:'center',
  },
  plus: {
    color:'white',
    fontSize: 25,
  }
});
请耐心等待,我希望我能正确地提出我的问题。请好,

1 个答案:

答案 0 :(得分:1)

您只能在执行

时导入API's from Expo's SDK

import { /* Something here */ } from 'expo';

要导入您自己的组件,您只需要从它们所在的目录中导入它们。

如果它与App.js在同一目录中,那么它将是:

import Component1 from './Component1';

如果您有一个src目录或其他目录,它将如下所示:

import Component1 from './src/Component1';