Làm sao cho children fill hết parent

HIện tại em có view như sau

<view style="min-height: 100%;">
 <view class="child1"/>
 <view class="child2"/>
</view>

Em đã thử cho display là flex và flex bằng 1, mà nó k có 100% parent, có cách nào cho child 2 nó fill hết parent k ạ?

Hi @namvo

Mình thấy bạn đang dùng tabs component và muốn set height cho content bên trong. Hiện tại content bên trong tabs không hỗ trợ việc height auto 100% nhé bạn. Bạn có thể truyền height vào cho các item bằng cách tính height qua css hoặc dùng js nhé.

Cám ơn Hung, còn nếu view nó như vầy thì mình làm sao cho nó fill parent zạ?

<view style="display: flex; flex: 1; flex-direction: column; background-color: red;">
  <view style="flex: 1; background-color: yellow;">aaa</view>
  <view style="flex: 1; background-color: green;">bbb</view>
</view>

Hi @namvo

Để full height cho view parent thì bạn có thể dùng các thuộc tính như set height 100vh, hoặc dùng css variable như --tf-window-height hay dùng getSystemtInfo để lấy height nhé

Mình định cho children nó fill parent, coi ra phải lất height rồi tính toán rồi. Cám ơn bạn nhen

1 Like