我正试图在我的laravel应用程序中使用惯性。我的应用程序不需要jetstream,所以我不会使用它。所以我去了惯性的网站https://inertiajs.com/安装它,但我不确定我是否正确。
我在页面上看到的错误是
未找到视图[app]。
这是我的ProductController 中的内容
public function index()
{
return Inertia::render('components/products/Index');
}
这是我的索引.vue
<template>
<div>
<h1>Welcome</h1>
<p>Hello, welcome to your first Inertia app!</p>
</div>
</template>
<script>
export default {
components: {
},
props: {
},
}
</script>
并且在我的app.blade.php 中
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="x-ua-compatible" content="ie=edge">
<title>Admin</title>
<link rel="stylesheet" href="/vendor/adminlte/plugins/fontawesome-free/css/all.min.css">
<link rel="stylesheet" href="/css/style.css">
</head>
<body class="hold-transition sidebar-mini">
<div class="wrapper">
<!-- Navbar -->
<nav class="main-header navbar navbar-expand navbar-white navbar-light">
<!-- Left navbar links -->
<ul class="navbar-nav">
<li class="nav-item">
<a class="nav-link" data-widget="pushmenu" href="#" role="button"><i class="fas fa-bars"></i></a>
</li>
<li class="nav-item d-none d-sm-inline-block">
<a href="index3.html" class="nav-link">Home</a>
</li>
<li class="nav-item d-none d-sm-inline-block">
<a href="#" class="nav-link">Contact</a>
</li>
</ul>
<!-- Right navbar links -->
<ul class="navbar-nav ml-auto">
<li class="nav-item dropdown user-menu">
<a href="#" class="nav-link dropdown-toggle" data-toggle="dropdown"><span>{{ Auth::user()->name }}</span></a>
<ul class="dropdown-menu dropdown-menu-lg dropdown-menu-right">
<li class="user-header bg-primary h-auto">
<p class="mt-0"><span>{{ Auth::user()->name }}</span><small><span>{{ Auth::user()->title }}</span></small></p>
</li>
<li class="user-footer">
<a class="btn btn-default btn-flat float-right btn-block" href="#" onclick="event.preventDefault(); document.getElementById('logout-form').submit();">
<i class="fa fa-fw fa-power-off"></i> Log Out
</a>
<form id="logout-form" action="{{ route('logout') }}" method="POST" style="display: none;">
@csrf
</form>
</li>
</ul>
</li>
</ul>
</nav>
<!-- /.navbar -->
<aside class="main-sidebar elevation-4">
<a href="{{ route('home') }}" class="brand-link">
<img src="/img/default-brand.png" class="brand-image img-circle elevation-3"
style="opacity: .8">
</a>
</aside>
<div class="content-wrapper">
<div class="content-header">
<div class="container-fluid">
<div class="row mb-2">
<div class="col-sm-6">
<h1 class="m-0 text-dark">@yield('title')</h1>
</div>
</div>
</div>
</div>
<div class="content">
<div class="container-fluid">
@inertia
</div>
</div>
</div>
</div>
<script src="/jquery/jquery.min.js"></script>
<script type="text/javascript" src="{{ mix('js/app.js') }}"></script>
</body>
</html>
我不确定我是否遗漏了什么。
Inertia允许您从HandleInertiaRequests中间件设置应用程序根视图
protected $rootView = 'layout/app';
确保它与views/下的文件夹排列一致
在这种情况下,它应该是views/layout/app.blade.php
如果您愿意,还可以更改app.blade.php目录,方法是转到位于app\Http\middleware\HandleInertiaRequests.php中的惯性中间件文件,并将应用程序文件目录更改为您想要的位置:
protected $rootView = '/layouts/app';
应用程序。试试这个。
Route::get('/', function () {
return view('layouts/app');
});