Live data from Hacker News

Show HN: Vue-Model – Models with HTTP Actions for Vue.js

github.com

1–10 of 46 posts

Re: Show HN: Vue-Model – Models with HTTP Actions for Vue.js

#2
What exactly happens when the user modifies the field customer.name but doesn’t hit save/trigger customer.http.update()? I usually resolve this by mirroring customer.name to this.formData.name and having a reset property for this.formData.

Also how does it work with nested models returned from the server? Can I do user.tickets.push(newTicket) in some form?

Re: Show HN: Vue-Model – Models with HTTP Actions for Vue.js

#3

What exactly happens when the user modifies the field customer.name but doesn’t hit save/trigger customer.http.update()? I usually resolve this by mirroring customer.name to this.formData.name and having a reset property for this.formData. Also how does it work with nested models returned from the server? Can I do user.tickets.push(newTicket) in some form?

If the user modifies customer.name and then doesn't trigger save, nothing happens, ie: doesn't persist to the backend.

To "reset" a form, I guess you could get it again from the server via customer.http.fetch()

Re: Show HN: Vue-Model – Models with HTTP Actions for Vue.js

#4
post #3

What exactly happens when the user modifies the field customer.name but doesn’t hit save/trigger customer.http.update()? I usually resolve this by mirroring customer.name to this.formData.name and having a reset property for this.formData. Also how does it work with nested models returned from the server? Can I do user.tickets.push(newTicket) in some form?

If the user modifies customer.name and then doesn't trigger save, nothing happens, ie: doesn't persist to the backend. To "reset" a form, I guess you could get it again from the server via customer.http.fetch()

But how do I know when to fetch? With my approach global state is not modified until the user explicitly does it. Modifying customer.name and not saving it will persist until the next fetch() and in the meantime the user will see it as if the name was actually saved.

Re: Show HN: Vue-Model – Models with HTTP Actions for Vue.js

#5
post #3

Earlier quoted context omitted.

If the user modifies customer.name and then doesn't trigger save, nothing happens, ie: doesn't persist to the backend. To "reset" a form, I guess you could get it again from the server via customer.http.fetch()

But how do I know when to fetch? With my approach global state is not modified until the user explicitly does it. Modifying customer.name and not saving it will persist until the next fetch() and in the meantime the user will see it as if the name was actually saved.

Not sure I'm following your exact setup... But you could of course just make a model for your form and _not_ your customer. Without seeing your full setup, it's hard for me to say for sure!

Re: Show HN: Vue-Model – Models with HTTP Actions for Vue.js

#7

Neat! Is this meant to replace Vuex / some other store?

No, I probably wouldn't say that this replaces Vuex.

I don't use Vuex, I find it to be more complex than I need. I build a lot of CRUDdy apps that are pretty straightforward, so I've never dived into it much. I've watched the lessons on Laracasts for it, but just don't need it yet.

This is to replace the instances where you have a update() methods in your vue instances that set up axios, organize the data, send the request, and handle the response.

It's very much for restful resources.

Re: Show HN: Vue-Model – Models with HTTP Actions for Vue.js

#8
I'm usually a Django backend developer doing the whole server-rendered static html type sites, but I've attempted to venture into the world of single page apps a few times. The thing that always tripped me up was figuring out the frontend model layer. Nothing I've used, whether Redux or Vuex or Mobx or whatever else seemed as elegant and simple as say the Django ORM is on the backend. There were always missing pieces that I couldn't quite get working cleanly, like validation, or loading indicators, etc.

This looks like it has the potential to be what I was hoping someone would make. Looks excellent so far, thanks for sharing!

Re: Show HN: Vue-Model – Models with HTTP Actions for Vue.js

#9

I'm usually a Django backend developer doing the whole server-rendered static html type sites, but I've attempted to venture into the world of single page apps a few times. The thing that always tripped me up was figuring out the frontend model layer. Nothing I've used, whether Redux or Vuex or Mobx or whatever else seemed as elegant and simple as say the Django ORM is on the backend. There were always missing pieces…

Thanks for saying that. It sounds like you and I are quite similar. I've never built a full SPA because I it's _so_ much easier and faster for me to build "traditional" apps. Since discovering Vue.js I've started wading further and further into sprinkling JS components onto the page.

Vuex, Redux, etc just don't make sense in my brain, so I've never used them. I built this because I wanted something simple to interact with my Laravel backends. Most of what I do is CRUDdy, and this is super helpful for that.

Re: Show HN: Vue-Model – Models with HTTP Actions for Vue.js

#10

I'm usually a Django backend developer doing the whole server-rendered static html type sites, but I've attempted to venture into the world of single page apps a few times. The thing that always tripped me up was figuring out the frontend model layer. Nothing I've used, whether Redux or Vuex or Mobx or whatever else seemed as elegant and simple as say the Django ORM is on the backend. There were always missing pieces…

Might be the first time I've seen the words "elegant", "simple" and "Django's ORM" in the same sentence. You could say it's easy to get started with, or do simple queries, but it's definitely not simple nor elegant.
Post reply on HN