通过惯性填充表中的数据

Question

好吧，我需要说清楚，我是老学生。学习惯性是我的一个目标，但我在思考这个基本问题时遇到了问题。我只是让别人告诉我我做错了什么，这样我就可以点击它回到原位并继续前进。考虑到这一点，以下是我正在努力实现的目标。

我还想强调的是，我付出了一切，因为我不确定我错在哪里，当人们没有发布足够的信息来解决他们的挑战时，我真的无法忍受，所以很抱歉，如果这超出了我分享所需的范围

我有一个下拉菜单，它需要从数据库中名为networks的表中提取数据

我已经创建了一个控制器、模型和路线：

路线：

Route::resource('networks', NetworkController::class);

型号：

<?php
namespace AppModels;
use IlluminateDatabaseEloquentFactoriesHasFactory;
use IlluminateDatabaseEloquentModel;
class Networks extends Model
{
protected $fillable = [
'network_name',
'network_description'
];
}
?>

控制器：

<?php
namespace AppHttpControllersNetworks;
use IlluminateHttpRequest;
use AppHttpControllersController;
use AppModelsNetworksNetworks;
use InertiaInertia;
class NetworkController extends Controller
{
/**
* Display a listing of the resource.
*
* @return IlluminateHttpResponse
*/
public function index()
{
$networks = Network::latest();
return Inertia::render('Network/Index', ['networks' => $networks]);
}
/* CRUD FRAMEWORK BELOW */
?>

迁移：

<?php
use IlluminateDatabaseMigrationsMigration;
use IlluminateDatabaseSchemaBlueprint;
use IlluminateSupportFacadesSchema;
return new class extends Migration
{
/**
* Run the migrations.
*
* @return void
*/
public function up()
{
Schema::create('networks', function (Blueprint $table) {
$table->id();
$table->string('network_name');
$table->string('network_description');
$table->timestamps();
});
}
/**
* Reverse the migrations.
*
* @return void
*/
public function down()
{
Schema::drop('networks');
}
};

最后，我有一个Vue组件：

<template>
<Listbox as="div" v-model="selected">
<ListboxLabel class="mb-2 block text-md font-medium text-gray-100">Pick a network </ListboxLabel>
<div class="mt-1 relative">
<ListboxButton class="relative w-full bg-white border border-gray-300 rounded-md shadow-sm pl-3 pr-10 py-2 text-left cursor-default focus:outline-none focus:ring-1 focus:ring-red-500 focus:border-red-500 sm:text-sm">
<span class="block truncate">Select a network...</span>
<span class="absolute inset-y-0 right-0 flex items-center pr-2 pointer-events-none">
<SelectorIcon class="h-5 w-5 text-gray-400" aria-hidden="true" />
</span>
</ListboxButton>
<transition leave-active-class="transition ease-in duration-100" leave-from-class="opacity-100" leave-to-class="opacity-0">
<ListboxOptions class="absolute z-10 mt-1 w-full bg-white shadow-lg max-h-60 rounded-md py-1 text-base ring-1 ring-black ring-opacity-5 overflow-auto focus:outline-none sm:text-sm">
<ListboxOption as="template" v-for="network in networks.data" :key="network.id" :value="network_name" v-slot="{ active, selected }">
<li :class="[active ? 'text-white bg-red-600' : 'text-gray-900', 'cursor-default select-none relative py-2 pl-8 pr-4']">
<span :class="[selected ? 'font-semibold' : 'font-normal', 'block truncate']">
{{ network.network_name }}
</span>
<span v-if="selected" :class="[active ? 'text-white' : 'text-red-600', 'absolute inset-y-0 left-0 flex items-center pl-1.5']">
<CheckIcon class="h-5 w-5" aria-hidden="true" />
</span>
</li>
</ListboxOption>
</ListboxOptions>
</transition>
</div>
</Listbox>
</template>
<script>
import { ref } from 'vue'
import { Listbox, ListboxButton, ListboxLabel, ListboxOption, ListboxOptions } from '@headlessui/vue'
import { CheckIcon, SelectorIcon } from '@heroicons/vue/solid'
import { Head } from "@inertiajs/inertia-vue3";
import { Link } from "@inertiajs/inertia-vue3";
export default {
components: {
Listbox,
ListboxButton,
ListboxLabel,
ListboxOption,
ListboxOptions,
CheckIcon,
SelectorIcon,
Link, 
Head,
},
props: {
networks: Object,
},
setup() {
const selected = ref(networks[1])
return {
selected,
}
},
}
</script>

它没有得到数据，我一辈子都不明白为什么。它把我逼疯了。我知道我会在axios中做些什么来实现这一点，但Inertia似乎太强大了，我错过了不使用它的机会。

任何帮助都将永远心存感激。

Answer 1

$networks = Network::latest()

将返回一个查询生成器。要获取数据集链，请在末尾使用get((。

尝试：

$networks = Network::latest()->get()