Question

我需要这样做，以便用户可以填写表单，并在 Google Places API 上找到运动过滤页面点击提交，并使用刚刚填写的表单替换api链接中的文字来过滤结果。经过一些研究，我非常确定您在 API链接和表单中使用 + this.state.variable + ，您使用 value = {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();
 }

过滤页面

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}`;

将原生用户输入数据反应到API链接

1 个答案: