阵营本地用户输入数据转换成API链接

Question

我需要它使用户可以填写表格与运动他们想找到谷歌Places API的上的过滤器页面点击提交和有他们刚刚填写的表格替换api链接中的文本来过滤结果。经过一番研究即时通讯相当确信你使用+ this.state.variable +在API链接并在形式您使用值= {} this.state.variable

我上获取请求结果页

fetchData() { 
    fetch('https://maps.googleapis.com/maps/api/place/nearbysearch/json?key=GooglePlacesAPIKey&radius=5000&keyword=+this.state.variable+&location=+this.state.geolocation+') 
    .then((response) => response.json()) 
    .then((responseData) => { 
     this.setState({ 
      dataSource: this.state.dataSource.cloneWithRows(responseData.results), 
      isLoading: false 
     }); 

    }) 
    .done(); 
} 

过滤器Page

render(){ 
    return (
    <View style={styles.container}> 
    <View style={styles.loginContainer}> 

    <TextInput 
    style={styles.searchInput} 
    value={this.state.variable} 
    onChange={this.handleChange.bind(this)}/> 

    <TouchableHighlight 
     style={styles.button} 
     onPress={this.goToSpotlight.bind(this)}> 
     <Text style={styles.buttonText}> Search </Text> 
    </TouchableHighlight> 
    </View> 
    </View> 

Answer 1

fetchData() { 
    fetch('https://maps.googleapis.com/maps/api/place/nearbysearch/json?key=GooglePlacesAPIKey&radius=5000&keyword=+this.state.variable+&location=+this.state.geolocation+') 
    .then((response) => response.json()) 
    .then((responseData) => { 
     this.setState({ 
      dataSource: this.state.dataSource.cloneWithRows(responseData.results), 
      isLoading: false 
     }); 

    }) 
    .done(); 
} 

您的查询中有错误。它应该这样做：

var query = `https://maps.googleapis.com/maps/api/place/nearbysearch/json?key=GooglePlacesAPIKey&radius=5000&keyword=${this.state.variable}&location=${this.state.geolocation}`;