vue.js - Multiple forms on a page -

i have been researching hours , admit defeat. have page lists bunch of users , allows reset users password. click reset button user , brings modal box password reset form in.

i use vue.js validate form , submit it, using ajax (vue-resource). list of users , unique modals generated laravel in blade view.

my question is, how have unique vue instance (or whatever should do) each form on page?

my investigation suggests using components cannot seem work not sure right thing do, still have same component multiple times on page? (and each form has unique data (the user id)).

thanks!

multiple component instances in fact way go. if generating users inside loop, pass user id property of component.

@foreach ($users $user)     <form-component id="{{ $user->id }}"</form-component> @endforeach  var formcomponent = vue.extend({         template: '<form> \         <input name="user-{{id}}"></input>\         <button>submit</button> \         </form>',     props: ['id'], }); 

passing data props