React-Native-Swiper 高度调整

Question

我正在制作一个 React 本机应用程序。有一个地图屏幕，我在上面实现了一个反应本机滑动器，它显示了某个地区的房屋列表。我面临的问题是滑动器占据了屏幕的整个高度。我怎样才能调整它的高度？

我尝试通过在样式中给出其高度来解决这个问题，但它不起作用

Answer 1

从样式中删除 flex :1 即可工作

import React from 'react';
import {StyleSheet, Text, View} from 'react-native';
import Swiper from 'react-native-swiper';

const Swipe = ({navigation}) => {
   return (
       <>
        <View>
         <Text>HomePage</Text>
        </View>
        <Swiper style={styles.wrapper} height={800}>
        <View style={styles.slide1}>
           <Text style={styles.text}>Hello Swiper</Text>
        </View>
        <View style={styles.slide2}>
          <Text style={styles.text}>Beautiful</Text>
        </View>
        <View style={styles.slide3}>
          <Text style={styles.text}>And simple</Text>
        </View>
       </Swiper>
       </>
       );
     };

     const styles = StyleSheet.create({
       slide1: {
         height: 400,
         justifyContent: 'center',
         alignItems: 'center',
         backgroundColor: '#9DD6EB',
       },
       slide2: {
          height: 400,
          justifyContent: 'center',
          alignItems: 'center',
          backgroundColor: '#97CAE5',
         },
         slide3: {
           height: 400,
           justifyContent: 'center',
           alignItems: 'center',
           backgroundColor: '#92BBD9',
         },
         text: {
         color: '#fff',
         fontSize: 30,
         fontWeight: 'bold',
         },
      });

     export default Swipe;