flex垂直两端分布

<view class="test-box">
            <view class="left-box">left</view>
            <view class="right-box">
                <view class="right-top">right top</view>
                <view class="right-lower">right lower</view>
            </view>
        </view>

.test-box {
    display: flex;
    align-items: center;
    .left-box {
        height: 300rpx;
        background-color: #ddd;
    }
    .right-box {
        display: flex;
        // flex-direction: column;
        flex-wrap: wrap;
        align-content: space-between;
        flex: 1;
        height: 300rpx;
        .right-top {
            width: 100%;
        }
        .right-lower {
            align-self: flex-end;
        }
    }
}