Question

如何验证vuetify数据表上的复选框选择？

我有一个显示某些事件数据的数据库，用户将选择这些事件来注册这些事件，但是某些事件可能会破坏时间表。因此，我需要检查用户选择的事件是否与他已经选择的其他事件发生冲突。如果是这样，我需要显示一个模式错误，并且应该取消选中该复选框。

<template>
  <v-data-table
    v-model="selected"
    :headers="headers"
    :items="events"
    item-key="id"
    class="elevation-1"
  >
    <template v-slot:items="props">
      <td>
        <v-checkbox
          v-model="props.selected"
          primary
          hide-details
        ></v-checkbox>
      </td>
      <td>{{ props.item.name }}</td>
      <td>{{ props.item.startDate }}</td>
      <td>{{ props.item.endDate }}</td>
    </template>
  </v-data-table>
</template>

我已经尝试过一些操作，例如在v-checkbox上设置property：rules，但是没有成功。有什么想法吗？

在选择数据表验证时

0 个答案: