кратно <Picker>в пределах <view>возможно? - PullRequest
Новая
       7

кратно <Picker>в пределах <view>возможно?

0 голосов
/ 25 апреля 2018

Если мне нужно использовать <Picker>..</Picker> более одного раза в пределах <View>..</View>, как я могу выбрать выбранное ЗНАЧЕНИЕ с другим <Picker>, поскольку this.state.PickerValue дает выбранное значение.

Ответы [ 2 ]

0 голосов
/ 25 апреля 2018

Используйте разные значения состояния, по одному для каждого сборщика. 

import React, { Component } from 'react';
import { View, Picker } from 'react-native';

class PickersComp extends Component {
  state = {
    val1 : '',
    val2: '',
    val3: '',
  }

  render(){
    return (
      <View>
        <Picker
          selectedValue={this.state.val1}
          style={{ height: 50, width: 100 }}
          onValueChange={(itemValue, itemIndex) => this.setState({ val1: itemValue })}>
          <Picker.Item label="Java" value="java" />
          <Picker.Item label="JavaScript" value="js" />
        </Picker>

        <Picker
          selectedValue={this.state.val2}
          style={{ height: 50, width: 100 }}
          onValueChange={(itemValue, itemIndex) => this.setState({ val2: itemValue })}>
          <Picker.Item label="foo" value="foo" />
          <Picker.Item label="bar" value="bar" />
        </Picker>

        <Picker
          selectedValue={this.state.val3}
          style={{ height: 50, width: 100 }}
          onValueChange={(itemValue, itemIndex) => this.setState({ val3: itemValue })}>
          <Picker.Item label="test" value="test" />
          <Picker.Item label="test2" value="js" />
        </Picker>
      </View>
    );
  }
};
0 голосов
/ 25 апреля 2018

Попробуйте что-то вроде этого

Конструктор 

constructor(props) {
    super(props);
    this.state = {
       language: '',
       level: '',
    };
}

Ваш метод рендеринга 

<View style={styles.container}>
    <Picker
       selectedValue={this.state.language}
       style={{ height: 50, width: '100%' }}
       onValueChange={(itemValue, itemIndex) =>
          this.setState({ language: itemValue })}>
       <Picker.Item label="Java" value="java" />
       <Picker.Item label="JavaScript" value="js" />
    </Picker>

    <Picker
       selectedValue={this.state.level}
       style={{ height: 50, width: '100%' }}
       onValueChange={(itemValue, itemIndex) =>
          this.setState({ level: itemValue })}>
       <Picker.Item label="Beginner" value="beginner" />
       <Picker.Item label="Intermediate" value="intermediate" />
       <Picker.Item label="Professional" value="professional" />
    </Picker>
</View>

Ознакомьтесь с живой демонстрацией здесь

Подробнее о API выбора здесь

...