Laravelのルート関数をJSで実装する方法を教えます

次のチュートリアル コラムは、あなたの知らない Laravel ORM のすばらしい操作を紹介するために Laravel によって開発されました。それ！

Laravel のルーティング モジュールでは、各ルートに次のような名前を設定できます。

Route::get('/blog/{blog}', 'BlogController@show')->name('blog.show');

次に、route('blog .show' を渡すことができます) , ['blog' => 1]) を使用して、このルートのアクセス アドレスを取得します。バックエンド ジャンプは

return redirect()->route('blog.show', ['blog' => 1]);

で実行できます。この利点は、URL が変更された場合などに、 /blog/{blog} を /boke/{blog} に変更するには、ルーティング ファイルを変更するだけで済み、その他の調整は必要ありません。したがって、各ルートに名前を付け、ルート名を通じて取得することをお勧めします。

ただし、これはバックエンド テンプレートとブレード テンプレートでのみ利用可能です。少し規模が大きい Web サイトでは、js ファイルが分離され、ブレード テンプレートに直接 js が書き込まれないため、ajax がjs. リクエストまたはページ ジャンプを行うときは、

location.href = '/blog/' + id;

などのリクエスト アドレスのみをハードコーディングできます。この場合、ルートが変更された場合は、js ファイルを変更する必要があります。同じルートの場合は、js ファイルを変更する必要があります。は複数の JS によって呼び出されるので、いくつかの変更を見逃しがちです。

そこでバックエンド風のルート関数をjsで実装できないか考えてみました。

最終的な解決策は非常に簡単で、2 つの関数だけで実行できます。

バックエンド部分は関数を実装する必要があります:

function route_uri($name)
{
    return app('router')->getRoutes()->getByName($name)->getUri();
}

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

echo route_uri('blog.show'); 
// 会输出/blog/{blog}

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

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;
}

注 1: ES6 構文、babel を使用しない場合は ES5 に変換してください

注 2: ここでは Lodash を引用しています

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

route('/blog/{blog}', {blog: 1}); //返回 /blog/1
route('/blog/{blog}', {blog: 1, preview: 1}); //返回 /blog/1?preview=1

これは非常に簡単です。ブレード テンプレートで、このページで使用する必要があるすべてのパスをオブジェクトで定義します:

var routes = {
    blog: {
        show: '{{ route_uri('blog.show') }}',
        update: '{{ route_uri('blog.update') }}',
        destroy: '{{ route_uri('blog.destroy') }}'
    }
};

js ファイル内:

$.post(route(routes.blog.update, {blog: 1}), {title: 'xxx', content: 'xxx'})

使用方法とバックエンド ルートにほとんど違いはありません

laravel フレームワークの技術記事の詳細については、こちらをご覧ください laravelチュートリアル!

以上がLaravelのルート関数をJSで実装する方法を教えますの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。