React-native导入类以显示listView不起作用

时间:2017-07-19 13:19:51

标签: reactjs listview react-native

我正在学习react-native并且我遇到了这个问题。我有一个课程listView.js,其中包含ListView我要在index.android.js中显示的内容 我得到的错误是

The development server returned response error code: 500

URL: http://10.0.2.2:8081/index.android.bundle?platform=android&dev=true&hot=false&minify=false

Body:
{"from":"D:\\ReactNative\\first_app\\index.android.js","to":"./app/otherClass/listView","message":"Unable to resolve module `./app/otherClass/listView` from `D:\\ReactNative\\first_app\\index.android.js`: could not resolve `D:\\ReactNative\\first_app\\app\\otherClass\\listView' as a folder: it did not contain a package, nor an index file","name":"UnableToResolveError","type":"UnableToResolveError","errors":[{}]}
processBundleResult
    BundleDownloader.java:172
access$100
    BundleDownloader.java:38
execute
    BundleDownloader.java:108
emitChunk
    MultipartStreamReader.java:69
readAllParts
    MultipartStreamReader.java:116
onResponse
    BundleDownloader.java:96
execute
    RealCall.java:135
run
    NamedRunnable.java:32
runWorker
    ThreadPoolExecutor.java:1113
run
    ThreadPoolExecutor.java:588
run
    Thread.java:818

我的index.android.js

import React, {Component} from 'react';
import {Text, View, AppRegistry, StyleSheet, TextInput,Switch} from 'react-native';
import listView from './app/otherClass/listView';
export default class first_app extends Component{
  constructor(){
    super();
    this.state={
      textValue:'Hello Mithun',
      switchValue:false
    }
  }
  switch_switch(value){
    this.setState({
    switchValue:value
    });
  }
  onTextChange(value){
    this.setState({
    textValue:value
    });

  }
  render(){
    return(
      <View>
        <TextInput
                placeholder="Enter some text"
            value={this.state.textValue}
            onChangeText={(value)=>this.onTextChange(value)}
            />
          <Text>{this.state.textValue}</Text>
          <Switch
            value={this.state.switchValue}
            onValueChange={(value)=> this.switch_switch(value)}
           />

           <View>
            <Text>{listView}</Text>

           </View>

      </View>

      );
  }
}
const style=StyleSheet.create({
    myView: {
        backgroundColor:'#00f'
    },
    myText: {
        color: '#fff'
    }
});
AppRegistry.registerComponent('first_app',()=>first_app);

我的listView.js

import React, {Component} from 'react';
import {Text, View, AppRegistry, StyleSheet, TextInput,ListView} from 'react-native';
const users=[
  {name:'Chiranjibi poudel'},
  {name:'Rishi ram mukhiya'},
  {name:'Mahendra Bhat'},
  {name:'Surya Man Shrestha'}
]
export default class listView extends Component{
  constructor(){
    super();
      const ds = new ListView.DataSource({rowHasChanged: (r1, r2) => r1 !== r2});
      this.state={
        userData: ds.cloneWithRows(users),
      };
  }
  renderRow(users,sectionId,rowId,highlightRow){
    return(
      <View>
        <Text>{users.name}</Text>
      </View>
    );

  }
  render(){
    return(
      <ListView
        dataSource:{this.state.userData}
        renderRow={(users) => <Text>{users}</Text>}
      />

    );
  }
}
AppRegistry.registerComponent('listView',()=>listView);

listView.js的路径绝对正确。 我不知道我错在哪里。 谢谢。

1 个答案:

答案 0 :(得分:1)

我刚刚找到了答案。  1.确保您的import语句具有正确的语法  2.尝试运行一个或所有这些命令:     - 清除守望者手表:watchman watch-del-all
    - 删除node_modules文件夹:rm -rf node_modules && npm install     - 重置打包缓存:rm -fr $TMPDIR/react-*npm start -- --reset-cache。 第三个为我工作。希望这有帮助。