我正在使用laravel 5.7
和vuejs2
这是表单时出现的错误
错误: [Vue警告]:渲染错误:“ TypeError:无法使用'in'运算符搜索未定义的'form' 在发现 --->在resources / js / components / Users.vue
这是Users.vue的完整代码:
<template>
<div class="container">
<div class="row mt-5">
<div class="col-md-12">
<div class="card">
<div class="card-header">
<h3 class="card-title">Users List</h3>
<div class="card-tools">
<button class="btn btn-success " data-toggle="modal" data-target="#addNew">Add User
<i class="fas fa fa-user-plus fa-fw"></i>
</button>
</div>
</div>
<!-- /.card-header -->
<div class="card-body table-responsive p-0">
<table class="table table-hover">
<thead>
<tr>
<th>ID</th>
<th>Name</th>
<th>Email</th>
<th>Type</th>
<th>Modify</th>
</tr>
</thead>
<tbody>
<tr>
<td>183</td>
<td>John Doe</td>
<td>11-7-2014</td>
<td><span class="tag tag-success">Approved</span></td>
<td>
<a href="#">
<i class="fa fa-edit"></i>
</a>
| |
<a href="#">
<i class="fa fa-trash red"></i>
</a>
</td>
</tr>
</tbody>
</table>
</div>
<!-- /.card-body -->
</div>
<!-- /.card -->
</div>
</div>
<!-- Modal -->
<div class="modal fade" id="addNew" tabindex="-1" role="dialog" aria-labelledby="addNewLabel" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="addNewLabel">Add New</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<div class="form-group">
<input v-model="form.name" type="text" name="name"
placeholder="Name"
class="form-control" :class="{ 'is-invalid': form.errors.has('name') }">
<has-error :form="form" field="name"></has-error>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-danger" data-dismiss="modal">Close</button>
<button type="button" class="btn btn-primary">Create</button>
</div>
</div>
</div>
</div>
</div>
</template>
<script>
export default {
data(){
return
{
form: new Form({
name: '',
email: '',
email_verified_at: '',
password: ''
})
}
},
mounted() {
console.log('Component mounted.')
}
}
</script>
每当我要添加表单(粗体字母)时,都会显示错误。
有什么解决办法吗?谢谢进阶