[解決済み] div 内のボタンをクリックしたときに親がクリックされないようにする。

質問

の機能を無効にすることは可能でしょうか？ <div> 要素にある関数が実行されないようにすることはできますか？

button要素をクリックすると、関数が toggleSystemDetails はトリガーされるべきではないですか？これはVueで可能ですか？

<div v-on:click="toggleSystemDetails($event, system.id)" v-for="(system, index) in organization.systems" :key="system.id">
  Outer Div
  <button v-on:click="toggleTileOptionsMode($event, system.id, system.name, system.layout)">
    Inner Button
  </button>
</div>

どのように解決するのですか？

以下のサイトをご覧ください。 イベントモディファイア をご覧ください（Vue.js v2 docs、v3 docs はこちら ), v-on:click.stop は、そのクリックが親要素まで伝搬すること、または "bubbling" を停止します。