Vuetify：动态设置断点？

Question

我有一个滑块，希望用于在弹性盒网格上设置断点。根据当前值调整“列”数据点的网格xs1至xs12。我已经尝试了v-bind，这行不通。我将如何实现？

滑块：

<v-slider
  v-model="columns"
  :label="`Columns : ${columns}`"
  max="12"
  ticks
  ></v-slider>

弯曲：

<v-flex 
  v-for="(val, index) in numberOfRecords" 
  :key="index" 
  v-bind="`xs${columns}`">

数据：

data: () => ({
  numberOfRecords: 40,
  columns: 6,
}),

Answer 1

您需要pass an object to v-bind，它将对象的值绑定到与键名称相同的属性：

v-bind="{[`xs${columns}`]: true}"