<template> <view style="flex-grow: 1;"> <view> <text>flex-grow</text> <view style="width: 500rpx;height: 300rpx;background-color: gray;flex-direction: row;"> <view class="common" style="background-color: red;flex-grow: 0.5;"> <text>0.5</text> </view> <view class="common" style="background-color: green;flex-grow: 1;"> <text>1</text> </view> <view class="common" style="background-color: blue;flex-grow: 2"> <text>2</text> </view> </view> </view> </view> </template> <script> </script> <style> .common { width: 100rpx; height: 100rpx; justify-content: center; align-items: center; } </style>