带有vuetify的响应式布局

Question

我有一个布局，每行有4个div，现在在移动设备中，我想将4个div更改为像图片一样的2 div

这是我的代码

<v-layout wrap align-center>
    <v-flex
        v-for="n in 10  "
           :key="n"
           xs3
           >
           <p>testtttt</p>
     </v-flex>
</v-layout>

Vuetify的示例 https://codepen.io/thanhtungvo/pen/Padagq?&editors=100 当前有3张图片，如何更改2张图片并在移动版本中保持最大宽度（响应） 谢谢

Answer 1

感谢Vuetify，它可以像这样固定

; with 
cte as 
(select loc.CompanyNumber
    , loc.DeptId
    , loc.Action
    , loc. EffDate
    , RowNumber() over (partition by loc.CompanyNumber, loc.DeptId order by loc.EffDate desc) as RN
from    [dbo].[LocationsOpenClosed] as loc
) 
select  cte.CompanyNumber
    , cte.DeptId
    , cte.Action
    , cte.EffDate
from    cte
where   1 = 1
    and cte.RN = 1

xs6：用于小屏幕
md3：用于中等屏幕
其他指标可以检查文档 https://vuetifyjs.com/en/layout/display

Answer 2

<v-flex v-for="i in 6" :key="i" xs6>