Réagir Natif: onPress en déclenchant un autre OnPress

Question

J'utilise le composant génial <Picker> de Native Base.

import React, { Component } from 'react' 
import {View, Picker, Text, Button, Icon} from 'native-base' 

export default class PickSomething extends Component { 
    constructor(props) { 
    super(props) 

    this.state = { 
     SelectedValue: 'Foo', 
    } 
    } 

    render() { 
    return (
     <View > 
     <Text>Type: </Text> 

     <Picker 
      iosHeader="Select a Type" 
      selectedValue={this.state.SelectedValue} 
      onValueChange={(value) => { 
      this.setState(
       (prevState, props) => ({SelectedValue: value}) 
      )}}> 

      <Picker.Item label="Foo" value="Foo" /> 

      <Picker.Item label="Bar" value="Bar" /> 
     </Picker> 

     <Button 
      onPress={() => 
       //trigger the <Picker>onPress 
     }> 
      <Icon name="ios-arrow-dropdown-circle-outline"/> 
     </Button> 
     </View> 
    )} 
} 

Je voudrais qu'il soit plus évident qu'il s'agit d'une liste déroulante. Comment puis-je faire le Button onPrees déclencher l'onPress du Picker?

Answer 1

Sur Android, vous pouvez définir le prop mode="dropdown" pour afficher une liste déroulante ancrée à la vue du sélecteur. Cela rend une flèche sur le côté droit (vérifiez le gif from the NativeBase docs). iOS suit différentes directives de conception que Android afin que prop ne fonctionnera pas dans iOS malheureusement. Sous la hotte, NativeBase utilise le réactif natif Picker, mais je ne vois rien de documenté pour ouvrir impérativement le picker de l'extérieur en utilisant les réfs. Vous pouvez toujours vous frayer un chemin dans le code src, mais cela semble être une mesure de dernier recours.