包裹在标签内时,单击事件不会在按钮内触发

时间:2021-06-13 09:54:41

标签: javascript html vue.js

我将表格行包裹在 a 标记中,但按钮 @click 功能无法正常工作,它会打开来自 a 标记的链接。

我想在仅单击按钮时打开一个弹出菜单,当用户单击行时,它应该重定向它。我的意思是点击按钮不应该触发重定向

代码:

<nuxt-link
  style="color: #212121"
  v-for="item in customers"
  :key="item.userId"
  :to="'/customer/profile/?id=' + item.userId + '&name=' + item.name"
  role="row"
>
              <div role="cell">
                {{ item.name }}
              </div>
               <div role="cell">
                <v-btn
                  @click.stop="deleteItem(item)"
                  fab
                  x-small
                  text
                  class="ml-2"
                  color="danger"
                  v-if="
                    $store.state.role === 'manager' ||
                      $store.state.role === 'developer'
                  "
                >
                  <v-icon color="danger">
                    mdi-delete
                  </v-icon>
                </v-btn>
                <v-btn
                  @click.stop="editItem(item.userId)"
                  fab
                  x-small
                  color="primary"
                  class="ml-2"
                >
                  <v-icon color="white">
                    mdi-pencil
                  </v-icon>
                </v-btn>
              </div>
 </nuxt-link>

我使用 div 标签和 display: table CSS 标签创建了一个表格,并用 nuxt-link 包裹每一行以创建一个锚点

0 个答案:

没有答案
相关问题