首页 > 解决方案 > 选择在 Android 中展开,但在 iOS 中没有展开 - React Native

问题描述

**选择在 Android 中扩展但在 iOS 中不扩展,我正在使用 React Base,但 iOS 无法正常工作,请帮助我。如果您有其他方法,我接受(我是初学者,不要恨我:))**

export default () => {
  let [modalVisible, setModalVisible] = React.useState(false);
  const [service, setService] = React.useState('');

  return (
    <ScrollView>
      <View style={styles.containerView}>
        <TouchableOpacity
          style={styles.cadastraCaminhao}
          onPress={() => setModalVisible(true)}>
          <Text style={{ fontWeight: '700', color: '#FFF', fontSize: 18 }}>
            Cadastrar frete
          </Text>
        </TouchableOpacity>
      </View>
      <Modal
        visible={modalVisible}
        onRequestClose={() => {
          setModalVisible(!modalVisible);
        }}>
        <SafeAreaView style={{ alignItems: 'center' }}>
          <ScrollView>
            <View style={styles.containerCad}>
              <View>
                <Pressable
                  style={styles.button}
                  onPress={() => setModalVisible(!modalVisible)}>
                  <Image
                    style={styles.buttonClose}
                    source={require('../../../../assets/back.png')}
                  />
                </Pressable>
              </View>
              <View
                style={{
                  alignItems: 'center',
                  justifyContent: 'center',
                  textAlign: 'center',
                }}>
                <Text
                  style={{
                    fontSize: 20,
                    fontWeight: '700',
                    color: '#142850',
                    marginBottom: 16,
                  }}>
                  Cadastrar frete
                </Text>
              </View>
              <View>
                <View>
                  <TextInput
                    style={styles.inputCadCaminhao}
                    placeholder="Digite a placa do caminhão"
                  />
                  <TextInput
                    style={styles.inputCadCaminhao}
                    placeholder="Digite o nome do proprietário"
                  />
                  <Select
                    style={styles.inputCadCaminhao}
                    selectedValue={service}
                    minWidth="310"
                    accessibilityLabel="Selecione tipo de carroceria"
                    placeholder="Selecione tipo de carroceria"
                    _selectedItem={{
                      bg: '#27496D',
                      endIcon: <CheckIcon size="5" />,
                    }}
                    onValueChange={(itemValue) => setService(itemValue)}>
                    <Select.Item
                      label="Grade Baixa - Carga seca"
                      value="gradeBaixaCargaSeca"
                    />
                    <Select.Item
                      label="Grade alta – Graneleira"
                      value="gradeAltaGraneleira"
                    />
                    <Select.Item label="Prancha" value="prancha" />
                    <Select.Item label="Plataforma" value="plataforma" />
                    <Select.Item label="Baú" value="bau" />
                    <Select.Item
                      label="Baú frigorífico"
                      value="bauFrigorifico"
                    />
                    <Select.Item label="Sider" value="sider" />
                    <Select.Item label="Caçamba" value="cacamba" />
                    <Select.Item label="Canavieira" value="canavieira" />
                    <Select.Item label="Munck" value="munck" />
                    <Select.Item label="Florestal" value="florestal" />
                    <Select.Item label="Tanque" value="tanque" />
                    <Select.Item label="Poliguindaste" value="poliguindaste" />
                  </Select>
                  <TextInput
                    style={styles.inputCadCaminhao}
                    placeholder="Digite o registro ANTT"
                  />
                  <TextInput
                    style={styles.inputCadCaminhao}
                    placeholder="Digite a placa do semireboque"
                  />
                </View>
                <TouchableOpacity
                  style={styles.cadastraCaminhao}
                  onPress={() => setModalVisible(!true)}>
                  <Text
                    style={{ fontWeight: '700', color: '#FFF', fontSize: 18 }}>
                    Finalizar
                  </Text>
                </TouchableOpacity>
              </View>
            </View>
          </ScrollView>
        </SafeAreaView>
      </Modal>
    </ScrollView>
  );
};

标签: javascriptreact-native

解决方案


推荐阅读