Как установить State с помощью Picker в React-native? - PullRequest
Новая
       12

Как установить State с помощью Picker в React-native?

0 голосов
/ 09 марта 2019

Функция в моем проекте в поиске провинции, но теперь я использую ввод названия провинции, и теперь я хочу использовать Picker в React-native для установки значения из значения, выбранного пользователем. Как можно установить значение из значения, выбранного пользователем от сборщика?

Моя поисковая функция и конструктор. 

  constructor(props) {
    super(props);
    this.state = {
     currentCity: "Phuket",
     searchText: ""
 };
 this.handleSubmit = this.handleSubmit.bind(this);
}

handleSubmit(event) {
 event.preventDefault();
 const { searchText } = this.state;
 this.refs.modal3.close();
 this.setState({ currentCity: searchText });
}

Мой поиск и окно выбора. 

<TextInput
        placeholder="City name"
        ref={el => (this.element = el)}
        style={styles.textInput}
        value={this.state.searchText}
        onChangeText={searchText => this.setState({ searchText })}
      />
      <View>
        <Button style={styles.btn} onPress={this.handleSubmit}>
          <Text style={styles.submitText}>Submit</Text>
        </Button>
      </View>
      {//Dropdown Picker
      }
      <Picker
        selectedValue={this.state.language}
        style={{ height: 50, width: 200 }}
        onValueChange={(itemValue, itemIndex) =>
          this.setState({ language: itemValue })
        }
      >
        <Picker.Item label="Amnat Charoen" value="1906689" />
        <Picker.Item label="Ang Thong" value="1621034" />
        <Picker.Item label="Bangkok" value="1609350" />

1 Ответ

1 голос
/ 09 марта 2019

из кода, который вы указали в своем вопросе, я думаю, вы новичок в реагировании Ваш код неверен (вы только что скопировали и вставили код). эта часть selectedValue={this.state.language} в вашем Picker неверна, потому что в вашем state нет language.

представьте, что у вас есть Picker, в котором есть список городов. и у вас есть переменная в состоянии с именем selectedCity.

так что ваш сборщик будет выглядеть так: 

<Picker
  selectedValue={this.state.selectedCity}
  onValueChange={(itemValue, itemIndex) =>
  this.setState({ selectedCity: itemValue })
  }
 >
   <Picker.Item label="city1" value="1" />
   <Picker.Item label="city2" value="2" />
</Picker>

это создаст Picker список 2 городов (city1 - city2), и каждый раз, когда пользователь выбирает один из них, будет вызываться this.setState() и инициализация selectedCity в состоянии.

если вы хотите вызвать setState в другом методе, вместо 

onValueChange={(itemValue, itemIndex) =>
      this.setState({ selectedCity: itemValue })
      }

использование 

onValueChange={(itemValue, itemIndex) =>
     //call method here!
      }
...