如何使用 Vue 创建一个带值的复选框

Question

我正在尝试使用来自 php 文件的数据创建一个表，但我找不到一种方法来创建一个带有 FOLIO 值和 id 的复选框，这是我的方法：

门票.vue

    <template>

    <v-card class="elevation-5 pa-3">

    <v-data-table

        ref="data_table"

        :headers="configuracion.configClientes.encabezados"

        expand

        rows-per-page-text="Filas por página"

        :rows-per-page-items="[10, 20, 55, { text: 'Todas', value: -1 }]"

        :no-results-text="'No se han encontrado tickets'"

        :item-key="configuracion.configClientes.itemKey"

        v-model="seleccion"

        :configuracion="configuracion.configClientes"

        :items="cat_clientes.catalogo"

      >

      <template slot="headerCell" slot-scope="props">

          <span>

            {{ props.header.text }}

          </span>

      </template>

      <template slot="items" slot-scope="props">

        <tr>

          <td

              v-for="columna in configuracion.configClientes.encabezados"

              v-if="columna.value !== '$acciones'"

              :key="keyUUID()"

          >

            {{ formatearColumna( props.item, columna ) }}

          </td>

        </tr>

      </template>

      <template slot="no-data">

        <v-alert :value="true" color="warning" icon="warning">

          {{ configuracion.mensajeVacia ? configuracion.mensajeVacia : 'No hay tickets' }}

        </v-alert>

        </template>

      </v-data-table>

     </v-card>

   </template>

Answer 1

您可能正在寻找true-value并false-value在<v-checkbox>vuetify 组件内部。它可以看起来像这样的小东西。<v-data-table&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; :items="cat_clientes.catalog"&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; :headers="this.headers"&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; hide-default-headers&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; :items-per-page="10"&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; :search="search"&nbsp; &nbsp; >&nbsp; &nbsp; &nbsp; &nbsp; <template v-slot:item.status="{ item }">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <v-checkbox true-value="Done" false-value="Open" v-model="itemStatus" @change="changeCheckbox(item)"&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; color="primary"/>&nbsp; &nbsp; &nbsp; &nbsp; </template>