Alpine: Look for methods inside of a `methods` sub object

[ryangjchandler]

Similar to how Vue components work, I think it would be nice to automatically check for a methods sub object inside of the x-data object when a method gets called without having to use methods.methodName inside of the x attribute (quite messy). In my opinion, it adds a bit of separation to the objects, especially when using the controller based approach (defining the object at the window level).

Happy to implement this if anybody else would like this feature.

/cc @calebporzio @SimoTod @HugoDF what do you guys think about this?

[HugoDF]

Hmmm but Alpine doesn't differentiate between the different types of properties right?

In a way it could be useful to have "methods" to flag them as non-reactive property.

I personally like the simplicity of a single shallow object

[ryangjchandler]

Hmmm but Alpine doesn't differentiate between the different types of properties right?

In a way it could be useful to have "methods" to flag them as non-reactive property.

I personally like the simplicity of a single shallow object

Well, I was more thinking about event handler for clicks etc.

[SimoTod]

The main difference here is that vue components have a data property and a separate methods property while everything in Alpine is accessible straight away.
I know that Alpine is deeply inspired by Vue but part of the Vue syntax makes a lot of sense in Vue and not much in Alpine.
I personally don't see a real reason for a method object at root level to be treated differently since we are already inside the data section.
I guess it's down to what Caleb thinks anyway.

[ryangjchandler]

Yeah I get that. It's kind of out of the philosophy almost. Just a pattern that I generally use coming from a Vue background to keep my methods out of the data's way.

[calebporzio]

Yeah, I don’t think we should use a “method:” key for methods (although I could see cases where you would want that)