Каким образом можно сделать так, чтобы клик на компоненте не обрабатывался?

Как можно предотвратить запуск метода `runMetod` при клике на компонент внутри карточки, у которой установлено событие клика? Вот пример: <br/> <pre><code class="javascript">&lt;div @click="runMetod"&gt;
    &lt;Component /&gt;
 &lt;/div&gt;</code></pre>
  • 22 ноября 2024 г. 18:03
Ответы на вопрос 2
Чтобы предотвратить выполнение метода `runMetod` при клике на внутренний компонент `<Component />`, вы можете использовать метод `event.stopPropagation()`, который предотвращает "всплытие" события клика до родительского элемента. В этом случае, вам нужно добавить обработчик клика для компонента внутри родительского элемента. Пример кода будет выглядеть следующим образом:

```vue
<template>
  <div @click="runMetod">
    <Component @click.stop />
  </div>
</template>

<script>
export default {
  methods: {
    runMetod() {
      console.log("Метод запущен");
    }
  }
}
</script>
```

В этом примере обработчик `@click.stop` на компоненте внутри родительского `<div>` остановит распространение события клика, и метод `runMetod` не будет вызван при клике на `<Component />`.
<blockquote>Как игнорировать клик на компоненте?</blockquote> <br/> Как обычно - <a href="https://v3.ru.vuejs.org/ru/guide/events.html#%D0%BC%D0%BE%D0%B4%D0%B8%D1%84%D0%B8%D0%BA%D0%B0%D1%82%D0%BE%D1%80%D1%8B-%D1%81%D0%BE%D0%B1%D1%8B%D1%82%D0%B8%D0%B8" rel="nofollow">прочитав документацию</a> ))
Похожие вопросы