包含<Text>DeliverNow!</Text> <Text>Current位置</Text> <ChevronDownIcon/>的柔性盒增长视图容器需要占用整个空间

Question

**这里是我的主页代码**问题是包含<Text>DeliverNow!</Text> <Text>Current location</Text> <ChevronDownIcon/>的视图容器需要占用整个空间。但是它并没有占用整个左边的空间，UserIcon最终需要我使用的-增长，而不是工作，合理的内容属性，而不是工作

    *enter code here*
 <SafeAreaView className="bg-white pt-5">
      <Text className='text-red-500'>
        <View className="flex flex-row pb-3 items-center mx-4 space-x-2">
          <Image
            source={{
              uri: "https://links.papareact.com/wru",
            }}
            className="h-7 w-7 bg-gray-300 rounded-full p-4"
          />

> > > > flex-grow property is used here
**just Below view tag **
          <View className='flex-1'>
            <Text className="font-bold text-xs text-gray-300 ">
              Deliver Now!
            </Text>
            <Text className="font-bold text-xl">
              Current Location
              <ChevronDownIcon size={20} color="#00CCBB" />
            </Text>
          </View>
          <UserIcon size={35} color="#00CCBB"/>
        </View>
      </Text>
    </SafeAreaView>

Answer 1

要使flex-1工作，关系应该是siblings而不是parent-child.，兄弟姐妹的父显示应该是灵活的。

Parent   // display flex
 - child // display flex-none or flex-1 or flex-auto
 - child // display flex-none or flex-1 or flex-auto

您的代码位于

<View>
  - <Image>
  - <View>    // This view is inside the other view because of which it is not showing the desired property.
     - <Text>
     - <Text>

要使事物正常工作，请使用以下继承结构

<View>
  - <Image>
<View>    
  - <Text>
  - <Text>

两个View的父类都应该具有flex显示属性。