reactjs - Flex.Item 在 Ant Design Mobile React Native 中不起作用

Question

我正在尝试使用 Ant Design Mobile 的 Flex 功能来定位具有列的 flex 方向的按钮。似乎 Flex 和 Flex.Item 不起作用。按钮位置堆叠在一起。

应用程序.js

import React from 'react';
import {Text, View, StyleSheet, Image, TouchableOpacity, SafeAreaView} from 'react-native';
import {Provider, Button, WhiteSpace, Flex} from '@ant-design/react-native';
import customTheme from './src/styles/customTheme';


const App = () => {
   return (
      <Provider theme={customTheme}>
         <SafeAreaView>
            <View>  
               <Flex direction='column'>
                  <Flex.Item>                                   
                     <TouchableOpacity style={styles.facebookLoginButton} activeOpacity={0.5}>                                
                        <Image 
                           source={require('./img/facebookLoginButton.png')}
                           style={styles.img}                            
                        />        
                     </TouchableOpacity>         
                  </Flex.Item>
                  <Flex.Item>                       
                     <TouchableOpacity style={styles.googleLoginButton} activeOpacity={0.5}>     
                        <Image 
                           source={require('./img/googleLoginButton.png')}                                    
                        />      
                     </TouchableOpacity>                        
                  </Flex.Item>               
               </Flex>               
            </View>
         </SafeAreaView>
      </Provider>
   );
};
export default App;

const styles = StyleSheet.create({  
   facebookLoginButton: {              
      width: 240,
      height: 40
   },
   googleLoginButton: {      
      borderColor: '#D3D3D3',
      borderWidth: 0.5,
      width: 240,
      height: 40
   }
});