[英]Data listing using laravel and vue.js
我试图在 laravel 页面中列出一些数据,但结果没有得到填充。 你能检查并纠正我吗? 我不知道我是否正确地遵循了这一点。 目前,在 laravel 刀片模板中添加了 vue.js。
list.blade.php
@extends('layouts.app')
@section('title', 'Customers List')
@section('styles')
@endsection
@section('content')
<div class="container">
<div class="row">
<div class="col-md-10 col-md-offset-1">
<div class="panel panel-default">
<div class="panel-heading">Customers List</div>
<div class="panel-body">
<table class="table table-hover table-bordered" id="demo">
<thead>
<tr>
<th>Name</th>
<th>Age</th>
</tr>
</thead>
<tbody>
<tr v-for="people in peoples">
<td> @{{ people.name }} </td>
<td> @{{ people.age }} </td>
</tr>
<pre> @{{ $data | json }} </pre>
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
@endsection
@section('scripts')
<script src="/js/vue.js"></script>
<script src="/js/vue-resource.min.js"></script>
<script>
new Vue({
el: '#app',
data: {
peoples: [
{ name: 'John', age: 50 },
{ name: 'Smith', age: 20 },
{ name: 'Foo', age: 30 },
{ name: 'Joo', age: 60 }
]
}
});
</script>
@endsection
您在桌子上使用了错误的 ID。 在您的 Vue 对象中,您已将app
定义为 ID,但您的表具有 ID demo
。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.