Question

我有一个带有Laravel后端/React.js前端的应用程序。我正在使用React Router，所以要使该工作有效，我有指向Controller的任何路径，该路径将视图加载到其中的组件中。但是，当我在react端添加嵌套路由时，即“ blog /：blogId”，似乎完全跳过了加载组件的标签，而是从Laravel视图中显示了内容。

我原来有：

`Route::get('/{slug?}', 'ProjectsController@index'`

我尝试过：

`Route::any('{path}', function($path){
    $projects = Project::all();
    $posts = Post::all();
    return view('welcome', compact('projects', 'posts'));
})->where('path', '.*');`

这也不起作用：

`Route::get('/{slug?}/{id?}', 'ProjectsController@index'`

我想要的是让/blog和/ blog/2都转到ProjectsController@index，该视图会加载带有react标签的视图。

我在ProjectsController中的索引函数中的数据是：

  `$projects = Project::all();
    $posts = Post::all();

    //return $projects;
    return view('welcome', compact('projects', 'posts'));`

有没有人遇到过这个？谢谢。

已更新：

控制器索引方法返回的欢迎视图：

<div id="content"></div>是将我的基本组件加载到的位置。因此，导航到“ / blog”路由时，我看到了我的组件，当导航到“ / blog / anything”时，我看到了Laravel的登录和注册链接。

`@extends('layout')

@section('content')

    @if (Route::has('login'))
        <div class="top-right links">
            @if (Auth::check())
                <a href="{{ url('/home') }}">Home</a>
            @else
                <a href="{{ url('/login') }}">Login</a>
                <a href="{{ url('/register') }}">Register</a>
            @endif
        </div>
    @endif

<div id="content"></div>

@include('partials._scripts')

@endsection`

使用链接的组件：

`<a href={`/blog/${item.id}`} target="_blank">View here</a>

                    <Route path="/blog/:blogId" component={Post} />`

我在基本组件中的其他路线：

`<Switch>
<Route exact path="/" render={(props)=> <Home text={text} mobileNavIsOpen={hamburgerOpen} backgroundImage={background}/>} />
<Route path="/projects" component={Projects} />
<Route path="/blog" component={Blog} />
<Route component={NotFound} />
</Switch>`

我尝试将/ blog /：blogId路由与其他应用一起放置在基本应用中-仍然没有区别。

更新：

从react路由器中删除/ blog / route标签并仅保留'/ blog /：blogId时，它具有相同的效果。

更新/部分解决：

将(\\d+)添加到我的React Router路径：path = {{/blog/:id(\\d+)}正确地将我带到了嵌套组件。但是，它也确实加载了刀片视图内容，因此，作为临时解决方案，我取出了显示的刀片内容。最好看看是否有人有其他解决方法。谢谢。

Answer 1

尝试一下路线:: get（'/ {any}'，'ProjectController @ index'）-> where（'any'，'。*'）; 基本上，这已添加到route / web.php的末尾，因为您很可能正在尝试构建SPA，并且希望所有HTTP请求都由react路由器处理。

更新：根据您的更新，我知道您希望/ blog和/ blog /：ID都可以通过相同的方法处理。可以这样做路线：: get（'blog / {id？}'，'ProjectController @ index'）-> where（'id'，'[0-9] +'）; 如果在索引方法中需要ID，则将其作为方法的第一个参数，并将其发送到视图。

Laravel带有多个条的路由在React中不起作用

1 个答案: