Laravel + React routing with react-router-dom

Question

我尝试在我的 laravel 应用程序上创建一个反应路由。但这行不通。我已经遵循了几个教程，但没有任何成功。

首先，我将此路由添加到 route.php：

Route::get('/', function () {
return view('index', []); });

然后，在 index.blade 中.php：

    <div id="app"></div>
    <script src="{{asset('js/app.js')}}" ></script>

然后，在我的应用程序.js中，我添加了路由：

  <BrowserRouter>
    <Switch>
     <Route path="currency" component={Currency}/>
     <Route path="/" component={Index}/>
    </Switch>  </BrowserRouter>

当我到达 http://localhost/project/public 时，索引组件是可以的，但是当我尝试加入 http://localhost/project/currency 时，这不起作用。我尝试删除索引组件的路由，但货币也是如此。

你有想法吗？

Answer 1

"project"是应用程序的基本文件夹吗？

将 baseName 参数添加到浏览器路由器

    <BrowserRouter basename='/project'>

您还需要更新 laravel 路由文件，以便始终转到应用程序索引路由，如果它与模式匹配 .../project/...因此，/project 和/project/currency 都应该由 laravel 路由到索引，这是应用程序，应用程序从那里处理路由逻辑。不得不对我的CakePHP项目做同样的事情。

Answer 2

打开Laravel路由器以响应任何请求！

Route::get('{all?}', function(){
    return view('index');
})->where('all', '([A-zd-/_.]+)?');

Answer 3

来自 Web 的路由.php将为 Laravel 和 React，您可以从 Laravel进行任何路由以检索数据......包括

Route::view('/{path?}', 'index');

在 Web 路由的末尾，以便最终加载它以获取您的所有视图

Answer 4

在

路由目录中web.php添加以下内容：

Route::get( '/{path?}', function(){
   return view( 'view' );
    } )->where('path', '.*');

它将完美地工作。