Javascript 反应本机自动完成文本输入

例如，我有一个城镇列表。我需要创造一些类似的东西

---

如何创建它（适用于Android和IOS）？我应该把它放在哪里？

好的，根据你给我们的一点信息，我试着做一个你能找到的快速例子（根本没有设计）

我让你来做造型

从JSON文件读取数据：检查

代码如下：

'use strict';

var React = require('react-native');
var {
  AppRegistry,
  Component,
  StyleSheet,
  Text,
  TextInput,
  ListView,
  View,
} = React;

var adresses = [
  {
    street: "1 Martin Place",
      city: "Sydney",
    country: "Australia"
    },{
    street: "1 Martin Street",
      city: "Sydney",
    country: "Australia"
  }
];

var ds = new ListView.DataSource({rowHasChanged: (r1, r2) => r1 !== r2});

class SampleApp extends Component {
  constructor(props) {
    super(props);

    this.state = {
      searchedAdresses: []
    };
  };

  searchedAdresses = (searchedText) => {
    var searchedAdresses = adresses.filter(function(adress) {
      return adress.street.toLowerCase().indexOf(searchedText.toLowerCase()) > -1;
    });
    this.setState({searchedAdresses: searchedAdresses});
  };

    renderAdress = (adress) => {
    return (
      <View>
        <Text>{adress.street}, {adress.city}, {adress.country}</Text>
      </View>
    );
  };
  render() {
    return (
      <View style={styles.container}>
        <TextInput 
            style={styles.textinput}
            onChangeText={this.searchedAdresses}
            placeholder="Type your adress here" />
        <ListView
                    dataSource={ds.cloneWithRows(this.state.searchedAdresses)}
          renderRow={this.renderAdress} />
      </View>
    );
  };
}

var styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: 'center',
    alignItems: 'center',
    backgroundColor: '#FFFFFF',
  },
  textinput: {
    marginTop: 30,
    backgroundColor: '#DDDDDD',
    height: 40,
    width: 200
  }
});

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

“严格使用”；
var React=require（'React-native'）；
变量{
评估学，
组成部分，
样式表，
文本，
文本输入，
ListView，
看法
}=反应；
变量地址=[
{
街道：“马丁广场1号”，
城市：“悉尼”，
国家：“澳大利亚”
},{
街道：“马丁街1号”，
城市：“悉尼”，
国家：“澳大利亚”
}
];
var ds=新的ListView.DataSource（{rowHasChanged:（r1，r2）=>r1！==r2}）；
类SampleApp扩展组件{
建造师（道具）{
超级（道具）；
此.state={
搜索地址：[]
};
};
SearchedAddresses=（searchedText）=>{
var searchedAddresses=地址过滤器（函数（地址）{
返回地址street.toLowerCase（）.indexOf（searchedText.toLowerCase（））>-1；
});
this.setState（{searchedAddresses:searchedAddresses}）；
};
RenderAddress=（地址）=>{
返回(
{地址.街道}，{地址.城市}，{地址.乡村}
);
};
render（）{
返回(
);
};
}
var styles=StyleSheet.create({
容器：{
弹性：1，
为内容辩护：“中心”，
对齐项目：“居中”，
背景颜色：“#FFFFFF”，
},
文本输入：{
玛金托普：30，
背景颜色：“#DDDDDD”，
身高：40，
宽度：200
}
});
AppRegistry.registerComponent（'SampleApp'，（）=>SampleApp）；

我们需要更多信息提供帮助。你有本地存储的数据吗？您是否通过请求获取数据？可能会发布一些代码，这样我们就可以看到您的问题所在。我的数据存储在json文件中。感谢您提供此解决方案！它不再可用…链接已断开。@Gp2mv3我将代码放在一个小吃中：ListView已弃用。为实现这一目标而提供的任何其他选项