Vuetify 2.x网格系统与移动设备兼容

Question

我是最新版本的Vuetify的新用户，我正在尝试使其与移动设备兼容。 但是我找不到解决问题的方法...

知道了：

<v-container>
<v-row>
  <v-col class="col-xs-12 col-md-6 offset-sm-2">
    <h2>My title</h2>
  </v-col>

  <v-col class="col-xs-12 col-md-2">
    <v-text-field
      label="Search"
      outlined
      prepend-icon="mdi-magnify"
      v-model="search"
    />
  </v-col>
</v-row>

<v-row justify="center">
  <v-col cols="8">
    <v-data-table
      :headers="headers"
      :items="items"
      :search="search"
      :items-per-page="10"
      class="elevation-1"
    />
  </v-col>
</v-row>

但是，当我在移动条件下尝试使用xs-12时，它不起作用，我只是想在xs和sm中将标题和研究内容换成一行并填满。

有例子 of what I've got

有例子 of what I expect

如果您可以帮助我实现这一目标：）

谢谢！