我在哪里犯错误？我是Vue.js的初学者。有人可以帮我解释一下吗？我试图制作表格过滤器。
命名空间App \ Http \ Controllers \ cofus \ reports;
使用Illuminate \ Http \ Request;
使用App \ Http \ Controllers \ Controller;
使用App \ Client;
类ClientController扩展Controller {
public function __construct()
{
$this->middleware('auth:admin');
}
public function allClients()
{
$clients = Client::orderBy('id', 'desc')->paginate(10);
return view('cofus.reports.clients')->with('clients', $clients);
}
public function getData()
{
$model = Client::searchPaginateAndOrder();
$columns =Client::$columns;
response()
->json([
'model' => $model,
'columns' => $columns
]);
}
}
web.php
路线::前缀（＆＃39; cofus＆＃39;） - 基团（函数（）{
Route::get('/reports/clients', 'cofus\reports\ClientController@allClients')->name('reports.clients');
Route::get('/api/clients', 'cofus\reports\ClientController@getData');
}）;
本地主机：8088 / cofus / cofus /报告/客户端
<script src="https://unpkg.com/vue@2.5.16/dist/vue.js"></script>
<script src="https://unpkg.com/axios/dist/axios.min.js"></script>
<div id="root">
<clients source="/cofus/cofus/api/clients" title="Client Data"></clients>
<option v-for="column in columns" :value="column"></option>
</div>
<script>
var clients = Vue.component('clients',{
props: ['source', 'title'],
data(){
return {
model: {},
columns: {}
}
},
render: function created(){
this.fetchIndexData()
},
methods: {
fetchIndexData(){
var vm = this
axios.get(this.source)
.then(function(response) {
Vue.set(vm.$data, 'model', response.data.model)
Vue.set(vm.$data, 'columns', response.data.columns)
})
.catch(function(response){
console.log(response)
})
}
}
});
new Vue({
el: '#root',
})
</script>