当输入被清除时Google Auto Complete Places没有将状态设置为空

• Z时代
• 2024-01-10
• 分类：问答

我正在使用react-native-google-places-autocomplete来自动完成地点。我得到的结果是没有输入问题，并获得自动完成搜索的地方。当输入被清除时Google Auto Complete Places没有将状态设置为空

但是，当我点击了一定的成绩，然后我再清除GooglePlacesAutocomplete输入文本，该值仍然是以前的 点击结果项目。

每当我选择一个位置，我点击Set Camp下面的按钮是控制台日志。

这是其他屏幕截图，每当我清除输入文本和按钮再次单击我希望得到未定义或空字符串的控制台日志，但我得到的一个结果。这是截图。

下面是我对工作的代码：

SetCampScreen.js

import React, { Component } from 'react'; 
    import { View, 
    Text, 
    ScrollView, 
    TextInput 
    } from 'react-native'; 
    import * as actions from '../../actions'; 
    import { connect } from 'react-redux'; 
    import { GooglePlacesAutocomplete } from 'react-native-google-places-autocomplete'; 
    class SetCampScreen extends Component { 
    static navigationOptions = { 
      header: null, 
      }; 
    gotoPatientRegistrationScreen =() => { 
     console.log('At Patient Registration method.', this.props.description); 
    } 
    sendData = (data) => { 
     console.log('From send Data: ',data); 
     this.props.setLocation(data); 
    } 
    render() { 
     return (
     <ScrollView contentContainerStyle={{flexGrow : 1, justifyContent : 'center'}}> 
      <View style={styles.container}> 
       <GooglePlacesAutocomplete 
       placeholder="Where are you?" 
       minLength={2} // minimum length of text to search 
       autoFocus={false} 
       returnKeyType={'search'} // Can be left out for default return key https://facebook.github.io/react-native/docs/textinput.html#returnkeytype 
       listViewDisplayed="auto" // true/false/undefined 
       fetchDetails={true} 
       enablePoweredByContainer={false} 
       renderDescription={row => row.description} 
       styles={{ 
       textInputContainer: { 
       height: 50, 
       }, 
       textInput: { 
       borderRadius: 0, 
       marginLeft: 0, 
       marginRight: 0, 
       marginTop: 0, 
       height: 50, 
       borderWidth: 1, 
       borderColor: '#000', 
       }, 
       predefinedPlacesDescription: { 
       color: '#1faadb', 
       }, 
       }} // custom description render 
       onPress={(data, details = null) => { 
       // 'details' is provided when fetchDetails = true 
       this.sendData(data); 
       }} 
       getDefaultValue={() => { 
       return ''; // text input default value 
       }} 
       query={{ 
       // available options: https://developers.google.com/places/web-service/autocomplete 
       key: 'API_KEY', 
       language: 'en', // language of the results 
       }} 
       currentLocation={false} // Will add a 'Current location' button at the top of the predefined places list 
       currentLocationLabel="Current location" 
       nearbyPlacesAPI="GooglePlacesSearch" // Which API to use: GoogleReverseGeocoding or GooglePlacesSearch 
       GoogleReverseGeocodingQuery={{ 
       }} 
       debounce={200} 
       /> 
       <Button 
       title="Set Camp" 
       onPress={this.gotoPatientRegistrationScreen} 
       /> 
      </View> 
     </ScrollView> 
    ); 
    } 
    } 
    const styles = { 
    container: { 
     flex: 1, 
     backgroundColor: '#fff', 
     justifyContent: 'center' 
    }, 
    textInputStyle: { 
     fontSize: 16, 
     paddingLeft: 8, 
     paddingBottom: 3, 
     paddingRight: 8, 
     height: 60, 
    }, 
    }; 
    const mapStateToProps = state => { 
    return { 
     description: state.location.locationResponse 
     }; 
    } 
    export default connect(mapStateToProps, actions)(SetCampScreen); 

动作/ location_action.js

import axios from 'axios'; 
    import { NO_INTERNET, SET_LOCATION } from './types'; 
    import { NetInfo } from 'react-native'; 
    export const setLocation = (place) => async dispatch => { 
    const { description } = place; 
    console.log('Description from setLocation: ',description); 
    let netState = await NetInfo.isConnected.fetch(); 
    console.log('Net state', netState); 
    if(!netState) { 
     return dispatch({ type: NO_INTERNET }); 
    } 
    try { 
     dispatch ({ type: SET_LOCATION, payload: description }); 
    } catch(exp) { 
     console.log(exp); 
    } 
    }; 

动作/ index.js

export * from './location_action'; 

动作/ types.js

export const NO_INTERNET = 'no_internet'; 
export const SET_LOCATION = 'set_location'; 

减速器/ location_reducers.js

import { NO_INTERNET, SET_LOCATION } from '../actions/types'; 
export default function(state = {}, action) { 
    switch(action.type) { 
    case SET_LOCATION: 
     return { locationResponse: action.payload }; 
    default: 
     return state; 
    } 
} 

减速器/ index.js

import { combineReducers } from 'redux'; 
import locationResponse from './location_reducer'; 
export default combineReducers({ 
    location: locationResponse, 
}); 

我希望每当我明确的inputText描述的道具价值也应被清除。有人请指出要实现这一点。谢谢。

回答：

textInputProps={{ 
onChangeText: (text) => { console.log(text) } 
}} 

以上是 当输入被清除时Google Auto Complete Places没有将状态设置为空 的全部内容， 来源链接： utcz.com/qa/259799.html