首页 > 解决方案 > React Native - 无法在 React-Native-Elements 列表项中按要求均匀分布

问题描述

下面是我的组件,我只想<Text></Text>均匀地分配内容。注释掉的代码可以按需要工作,但在 react-native-elements 的列表项中却不起作用。有小费吗?谢谢。

import React from 'react';
import  { View, Text } from 'react-native';
import { ListItem } from 'react-native-elements';

const MemberList = ({members}) => {
  return (
    <View>
      {
        members && members.map((item, i) => (
          <ListItem key={i} bottomDivider>
            <ListItem.Content>
                <View style={{ display: 'flex', flexDirection: 'row', justifyContent: 'space-between'}}>
                  <Text>{item.tag}</Text>
                  <Text>{item.country}</Text>
                </View>
            </ListItem.Content>
          </ListItem>
        // <View style={{ display: 'flex', flexDirection: 'row', justifyContent: 'space-between'}}>
        //   <Text>{item.t[![enter image description here][1]][1]ag}</Text>
        //   <Text>{item.country}</Text>
        // </View>
        ))
      }
   </View>
  )
}

export default MemberList;

标签: cssreact-nativeflexbox

解决方案


推荐阅读