Explication détaillée de la façon d'implémenter la fonction de route de Laravel dans JS-js tutoriel-php.cn

Explication détaillée de la façon d'implémenter la fonction de route de Laravel dans JS

高洛峰

Libérer： 2017-02-15 17:01:39

original

2055 Les gens l'ont consulté

Tout le monde devrait savoir que dans le module de routage de Laravel, nous pouvons définir un nom pour chaque itinéraire, tel que :

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

Copier après la connexion

et ensuite vous pouvez obtenir l'adresse d'accès de cet itinéraire via

route(&#39;blog.show&#39;, [&#39;blog&#39; => 1])

Copier après la connexion

Pour le saut backend, vous pouvez utiliser

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

Copier après la connexion

<🎜. >

L'avantage est que si l'url change, par exemple, je veux changer

en '/blog/{blog}', il me suffit de changer le fichier de routage, et il n'y a rien à ajuster autre. '/boke/{blog}'

Mais cela est limité au backend et peut être utilisé dans les modèles de lame. Les sites Web avec une échelle légèrement plus grande sépareront les fichiers js et ne les écriront pas directement dans le modèle de lame. Cela entraînera l'envoi de requêtes ajax. envoyé en js. Vous ne pouvez écrire l'adresse de la demande que lorsque la page saute, comme

location.href = &#39;/blog/&#39; + id;

Copier après la connexion

De cette façon, si l'itinéraire change, vous devez modifier le fichier js. Si la même route est appelée par plusieurs js, il est facile de manquer une ou deux modifications. J'ai donc réfléchi à la possibilité d'implémenter une fonction de route de type backend dans js.

La solution finale est très simple, juste deux fonctions.

La partie backend doit implémenter une fonction

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

Copier après la connexion

La fonction de cette fonction est de renvoyer l'adresse de routage d'origine en fonction du nom de routage, tel que :

echo route_uri(&#39;blog.show&#39;); // 会输出/blog/{blog}

Copier après la connexion

Le frontal n'a également besoin que d'une seule fonction :

let route = (routeUrl, param) => {
 let append = [];
 for (let x in param) {
  let search = &#39;{&#39; + x + &#39;}&#39;;
  if (routeUrl.indexOf(search) >= 0) {
   routeUrl = routeUrl.replace(&#39;{&#39; + x + &#39;}&#39;, param[x]);
  } else {
   append.push(x + &#39;=&#39; + param[x]);
  }
 }
 let url = &#39;/&#39; + _.trimStart(routeUrl, &#39;/&#39;);
 if (append.length == 0) {
  return url;
 }
 if (url.indexOf(&#39;?&#39;) >= 0) {
  url += &#39;&&#39;;
 } else {
  url += &#39;?&#39;;
 }
 url += append.join(&#39;&&#39;);
 return url;
}

Copier après la connexion

Remarque : Ceci fait référence à lodash

La fonction de cette fonction est :

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

Copier après la connexion

Ensuite c'est très simple Définissez-le dans le template blade :

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

Copier après la connexion

Définissez-le simplement dans le fichier js :

$.post(route(routes.blog.update, {blog: 1}), {title: &#39;xxx&#39;, content: &#39;xxx&#39;})

Copier après la connexion

Pour des explications plus détaillées sur la façon d'implémenter la fonction de route de Laravel dans JS, veuillez faire attention au site Web chinois de PHP !