Day12 Vue Event Handing(v-on)

Event Handling是甚麽呢?

Event Handing是可以用v-on指令监听DOM事件，并在触发时执行一些 JavaScript 代码。

昨天我们已经有先说明v-on我就不在说明了。那今天我就来说说Event Modifiers(事件修饰符)，我们常见的有prevent、stop、capture、self...

@click.prevent

此范例为当点击button这个超连结时并不会跑到google的网页，反而是会跑出讯息

@click.stop

简单说在.stop的地方不会被执行，但是parent还是会照常执行

@click.capture

这个例子呢，再有capture的地方会叫先去执行，然後再去执行别的地方

@click.self

我们在这个例子里增加了middle method，并在parent的div多加了.self。

当点击button时，只出发其他的函数，主要是因为.self需要在条件event.target自身时，而此处的event.target为button。

@click.once

.once这就很明显，他就只会触发一次，之後再怎麽按button都不会跑出讯息。

今天就先到这了，明天见~