Added new .self modifier for event listeners

[ryangjchandler]

This PR introduces a new .self modifier with the same behaviour as Vue's implementation. This should also make it easier to prevent event's bubbled from nested elements being handled by parent elements, as in the case of #378.

When used on an element, i.e. <div @click.self="handle()">, the handle() method will only be called (or expression evaluated) if the element triggering the event matches the element that registered it. This will remove the need to add several .stop modifiers to nested elements when you don't want any event bubbling for that particular parent / component.

I'm not sure if it's worth noting in the docs / README that chaining modifiers in different orders, for example @click.self.prevent and @click.prevent.self, won't have any effect on the order of execution / evaluation since they are not being handled sequentially. The .prevent and .stop modifiers are always handled first, then the .self modifier.

P.s. there's a new test for this feature.

[ryangjchandler]

I realise now that the test I added doesn't test whether the handler runs when clicking the '.self' element... bozo moment 🤦‍♂️ Consider the test updated 😅

[calebporzio]

Thanks @ryangjchandler, great addition!

[bszyman]

Seconding that this is a really great addition. Thank you! :)