Многократный быстрый набор с vuetify - PullRequest
Новая
       13

Многократный быстрый набор с vuetify

1 голос
/ 05 марта 2019

Я хочу, чтобы в таблице было несколько номеров быстрого набора, по одному для каждой строки. Но когда я открываю один из них, активатор открывает все. В объекте данных есть свойство 'fab', которое изначально имеет значение false. 

<v-data-table
        :headers="testHeaders"
        indeterminate: false
        :items="testDesserts"
        :search="searchWord"
        :loading="loading"
        class="elevation-1 mt-1"
        hide-actions
        expand
        item-key="id_doc"
        no-data-text="Нема доступних података..."
      >
        <template slot="items" slot-scope="props">
          <tr @click="props.expanded = !props.expanded;"
            style="cursor: pointer;">
          <td>{{ props.item.receiver_full_name }}</td>
          <td>{{ props.item.id_doc }}</td>
          <td>{{ props.item.note }}</td>
          <td>

            <v-speed-dial
              v-model="fab"
              transition="scale-transition"
              fixed
              direction="left"
              open-on-hover
                    >
                  <v-btn slot="activator" fab flat small color="info">
                      <v-icon>account_circle</v-icon>
                      <v-icon>close</v-icon>
                  </v-btn>
                  <v-btn fab small flat color="info">
                      <v-icon>search</v-icon>
                  </v-btn>
                  <v-btn fab small flat color="primary">
                      <v-icon>edit</v-icon>
                  </v-btn>
                  <v-btn fab small flat color="error">
                      <v-icon>delete</v-icon>
                  </v-btn>
              </v-speed-dial>

          </td>
          <!--  -->
        </tr>
        </template>

Пожалуйста, помогите ...

1 Ответ

0 голосов
/ 28 мая 2019

Я решил эту проблему, изменив v-модель в v-speed-dial и v-btn на: id = "xxx"

В моем случае 'idx' - это индекс v-для, но это может быть любой уникальный идентификатор.

Например: 

          <v-speed-dial
            :id="idx"
            bottom
            right
            absolute
            direction="left"
            transition="slide-x-transition"
          >
            <template v-slot:activator>
              <v-btn :id="idx" color="blue-grey" dark fab>
                <v-icon>settings</v-icon>
                <v-icon>close</v-icon>
              </v-btn>
            </template>
            <v-btn ...

            </v-btn>
          </v-speed-dial>
...