Laravelのルート関数をJSで実装する方法を詳しく解説

高洛峰
リリース: 2017-02-15 17:01:39
オリジナル
2055 人が閲覧しました

Laravel のルーティング モジュールでは、各ルートに次のような名前を設定できることを皆さんは知っておく必要があります。 Jump は

Route::get('/blog/{blog}', 'BlogController@show')->name('blog.show')
ログイン後にコピー

を使用できます。これの利点は、URL が変更された場合、たとえば

したい場合、ルーティング ファイルを変更するだけで済み、他の場所を調整する必要がないことです。

ただし、これはバックエンドに限定されており、ブレード テンプレートで使用できます。これにより、js ファイルが分離され、ブレード テンプレートに直接書き込まれなくなります。これにより、ajax リクエストが js またはブレード テンプレートで送信されます。転送するときは、

route('blog.show', ['blog' => 1])
ログイン後にコピー

のようにリクエストアドレスを記述するだけで、同じルートを呼び出す場合はjsファイルを変更する必要があります。複数の JS を使用すると、1 つまたは 2 つの変更が発生するのを見逃す可能性があります。そこでバックエンド風のルート関数をjsで実装できないか考えてみました。

最終的な解決策は非常にシンプルで、たった 2 つの関数です。

'/blog/{blog}'改成 '/boke/{blog}'バックエンド部分は関数を実装する必要があります

return redirect()->route('blog.show', ['blog' => 1]);
ログイン後にコピー

この関数の機能は、次のようなルート名に基づいて元のルーティングアドレスを返すことです:

location.href = '/blog/' + id;
ログイン後にコピー

フロント- end にも必要な関数は 1 つだけです:

function route_uri($name)
{
 return app('router')->getRoutes()->getByName($name)->getUri();
}
ログイン後にコピー

注:

Lodash はここで引用されています

この関数の機能は次のとおりです:

echo route_uri('blog.show'); // 会输出/blog/{blog}
ログイン後にコピー

非常に単純で、ブレードで定義されています。テンプレート: js ファイル内の

let route = (routeUrl, param) => {
 let append = [];
 for (let x in param) {
  let search = '{' + x + '}';
  if (routeUrl.indexOf(search) >= 0) {
   routeUrl = routeUrl.replace('{' + x + '}', param[x]);
  } else {
   append.push(x + '=' + param[x]);
  }
 }
 let url = '/' + _.trimStart(routeUrl, '/');
 if (append.length == 0) {
  return url;
 }
 if (url.indexOf('?') >= 0) {
  url += '&';
 } else {
  url += '?';
 }
 url += append.join('&');
 return url;
}
ログイン後にコピー

ここだけ:

route('/blog/{blog}', {blog: 1}); //返回 /blog/1
route('/blog/{blog}', {blog: 1, preview: 1}); //返回 /blog/1?preview=1
ログイン後にコピー

Laravel のルート関数を JS で実装する方法の詳細な説明については、PHP 中国語 Web サイトに注目してください。

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート
私たちについて 免責事項 Sitemap
PHP中国語ウェブサイト:福祉オンライン PHP トレーニング,PHP 学習者の迅速な成長を支援します!