Expo/React Native: `align-self: Stretch` в дочернем элементе `flex-direction: columns` меняет высоту из-за переноса текс ⇐ CSS

[Anonymous]

В моем проекте Expo есть компонент React Native, который ведет себя странно. Я опубликую здесь некоторые фрагменты кода. К вашему сведению, я использую классы Nativewind для CSS, и они применяются правильно.
У меня есть внешний компонент View, возвращаемый функцией React:

Код: Выделить всё

{/* Title content here  */}

{!isCollapsed && (

renderContent()

)}

RenderContent() возвращает что-то вроде этого:

Код: Выделить всё

const renderContent = () => {
return contentList.map((content, index) => (



{content}



));
};

Содержимое, отображаемое в renderContent, растягивается по ширине гибкого контейнера за счет саморастягивания. Если я заменю self-stretch на w-full, по какой-то причине содержимое фактически не растянется на всю ширину гибкого контейнера. Если я вообще не добавляю никакого класса, он тоже растягивается на всю ширину. Это нормально, я просто использовал саморастягивание, чтобы обойти это и быть явным.
Однако проблема возникает в том, что , который отображает содержимое, иногда уменьшает свою высоту, потому что теперь для отображения того же содержимого требуется на одну строку меньше. внутри renderContent имеют правильную высоту, но , который обертывает renderContent, имеет высоту, как если бы текст никогда не переносился. Вся эта высота отображается в нижней части под всем отдельным содержимым из renderContent.
Интересно, что если я изменю , который оборачивает renderContent, на фрагмент , он все равно растянется на всю ширину, и теперь я могу видеть дополнительное пространство под каждым отдельным фрагментом контента, который фактически потерял высоту из-за переноса текста. Кроме того, компонент и внутренний в renderContent соответствующим образом меняют свою высоту, но я ясно вижу, что внешний в renderContent не меняет свою высоту.
Что происходит? И как исправить?
Редактировать: Некоторые изображения. 1-й с саморастягиванием и оберткой renderContent. Второй — с оберткой фрагмента . На третьем месте оборачивает его, но прикрепляет к представлению класс w-full.







Подробнее здесь: https://stackoverflow.com/questions/798 ... -child-cha