在页面上的多个表格

我一直在研究几个小时，我承认失败。我有一个页面列出了一堆用户，并允许您重置用户密码。您点击用户的重置按钮，它会弹出一个带有密码重置表单的模式框。在页面上的多个表格

我使用Vue.js验证表单并提交它，全部使用ajax（vue-resource）。用户列表和独特模式由Laravel在刀片视图中生成。

我的问题是，如何为页面上的每个表单创建一个唯一的Vue实例（或者我应该做的）？

我的调查建议使用组件，但我似乎无法得到这个工作，所以不确定这是正确的事情，因为我仍然会在页面上多次使用相同的组件。（并且每个表单都有唯一的数据（用户标识））。

谢谢！

2016-01-24 Nutbolt

实际上，多组件实例是最好的选择。如果您在for循环中生成用户，请将用户标识作为组件的属性传递。

@foreach ($users as $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 with Props

来源

2016-01-24 19:11:59 zxzak

谢谢！很高兴知道我正在寻找正确的方向。我在表单中有一些东西，所以宁愿在页面内写出表单而不是在模板属性中。我认为只要它在组件标签内部就可以了？目前它一直抱怨它是一个片段实例，并且值不是按组件显示的。 – Nutbolt

在页面上的多个表格

回答

相关问题