[RUBY] [Rails] Comment gérer les modifications d'URL après le rendu

supposition

L'environnement est le suivant. Mac OS Catalina 10.15.7 Ruby 2.7.1 Rails 6.0.3.3

J'essaierai de l'enregistrer aussi facilement que possible, également en tant que mémorandum de ma part. Le tutoriel Rails est utilisé ici comme exemple pour illustrer le problème.

Plus précisément, lors de la mise en œuvre de la fonction d'enregistrement des utilisateurs au chapitre 7, l'URL passera de «/ signup» à «/ users» lorsqu'elle sera rendue sur l'écran du formulaire après l'échec de l'enregistrement en raison de la validation. Le problème, c'est

L'URL passe de localhost: 3000 / signup à localhost: 3000 / users → Une erreur se produit lors du rechargement car la vue correspondant aux utilisateurs n'est pas créée.

J'expliquerai la solution au problème.

Cause

Lorsque l'action de création ne parvient pas à s'enregistrer en tant qu'utilisateur, «render'new» signifie que la nouvelle action n'est pas appelée et que seule la vue est commutée. Puisque l'action de création est / users, l'URL sera naturellement / users après l'action. L'incohérence entre cette URL et l'écran est un problème.

Politique de solution

La solution est de changer l'URL avec javascript sans changer le code du contrôleur. Chargez un js spécifique uniquement dans la vue cible. (Passer de / users à / signup, c'est-à-dire qu'il semble que l'URL soit fixée comme / signup même après l'action.)

Solutions

procédure

  1. Créez du javascript
  2. Activez javascript à utiliser dans la vue cible (vue d'enregistrement de l'utilisateur)
  3. Incorporer les balises uniquement dans la vue cible

1. Créez un fichier js

Créez les js suivants avec n'importe quel répertoire sous app / javascript / packs ou n'importe quel nom directement en dessous (users / signup_render.js dans ce cas).

app/javascript/packs/users/signup_render.js


history.replaceState('', '', '/signup')

J'ai évoqué ce qui suit. Explication facile à comprendre sur replaceState En savoir plus sur replaceState

Je modifie l'historique actuel avec la méthode history.replaceState () et remplace / users par / signup par le paramètre d'URL passé à la méthode.

2. Pour utiliser js

Créez un nouveau paramètre de compilation dans ʻapp / javascript / packs / application.js` pour compiler pour la vue cible.

app/javascript/packs/application.js



//↓ Code d'origine
require("@rails/ujs").start()
require("turbolinks").start()
require("@rails/activestorage").start()
require("channels")

//↓ Ajouter ceci
require("users/signup_render")

Le chemin est décrit à partir de app / javascript.

3. Intégration de balises dans la vue

Incorporez javascript_pack_tag dans la vue cible. Dans l'exemple du didacticiel, il s'agit de l'écran d'enregistrement de l'utilisateur présenté dans l'extrait 7.20.

erb:app/views/users/new.html.erb



 <!--Ceci est le code d'origine ↓-->

<% provide(:title, 'Sign up') %>
<h1>Sign up</h1>

<div class="row">
  <div class="col-md-6 col-md-offset-3">
    <%= form_with(model: @user, local: true) do |f| %>
      <%= render 'shared/error_messages' %>

      <%= f.label :name %>
      <%= f.text_field :name, class: 'form-control' %>

      <%= f.label :email %>
      <%= f.email_field :email, class: 'form-control' %>

      <%= f.label :password %>
      <%= f.password_field :password, class: 'form-control' %>

      <%= f.label :password_confirmation, "Confirmation" %>
      <%= f.password_field :password_confirmation, class: 'form-control' %>

      <%= f.submit "Create my account", class: "btn btn-primary" %>
    <% end %>
  </div>
</div>

<!--Ajoutez ceci ci-dessous ↓-->
<% if @user.errors.any? %>
  <%= javascript_pack_tag 'users/signup_render' %>
<% end %>

ʻSi @ user.errors.any? `Définit la condition "Une erreur de validation se produit = Veuillez traiter js uniquement lorsque l'enregistrement de l'utilisateur échoue et est rendu".

<% = javascript_pack_tag'users / signup_render '%> signifie "charger ʻapp / javascript / packs / users / signup_render.js`."

J'espère que ça t'as aidé.

Autres pages de référence

Recommended Posts

[Rails] Comment gérer les modifications d'URL après le rendu
[Introduction aux rails] Comment utiliser le rendu
[Android] Comment gérer les thèmes sombres
Comment installer Pry après avoir créé un environnement de développement Rails avec Docker
Comment gérer les actifs de précompilation a échoué.
Comment créer un environnement Rails 6 avec Docker
Comment créer une API avec GraphQL et Rails
[Rails] Comment créer un environnement avec Docker
Comment rediriger après la connexion de l'utilisateur avec Spring-security
Comment écrire des rails
Comment désinstaller Rails
Programme de régime avec préprocesseur (comment gérer la taille i-appli)
Comment pousser une application développée avec Rails vers Github
Comment supprimer un objet new_record construit avec Rails
Comment traiter Aucun modèle de demande interactive
Comment générer manuellement un JWT avec Knock in Rails
[Environnement Docker] Comment gérer ActiveSupport :: MessageEncryptor :: InvalidMessage
[Comment insérer une vidéo dans un hameau avec Rails]
Comment interroger Array dans jsonb avec Rails + postgres
Comment gérer les erreurs dans Rails? Impossible de trouver un runtime JavaScript.
[rails] Comment publier des images
[Rails] Comment utiliser enum
[Rails] Comment utiliser enum
Comment lire les itinéraires des rails
Comment utiliser la jonction de rails
Comment numéroter (nombre) avec html.erb
Comment mettre à jour avec activerecord-import
Comment terminer le serveur de rails
Comment écrire des graines de Rails
[Rails] Comment utiliser la validation
[Rails] Comment désactiver les turbolinks
[Rails] Comment utiliser authenticate_user!
[Rails] Comment mettre en œuvre le scraping
[Rails] Comment faire des graines
Comment écrire le routage Rails
[Rails] Comment installer simple_calendar
[Rails] Comment installer reCAPTCHA
[Rails] Comment utiliser Scope
Comment générer automatiquement un diagramme ER lors de la migration avec Rails 6
Comment définir des variables d'environnement lors de l'utilisation de Payjp avec Rails
[Rails] Différentes différences entre redirect_to et méthode de rendu et méthode de sortie de la méthode de rendu
[Avec des astuces de retour] Comment présenter React aux rails les plus simples
Comment spécifier la base de données lors de la création d'une application avec des rails
Comment gérer l'erreur ERREUR: lors de l'exécution de gem ... (Gem :: FilePermissionError)
Comment gérer Bundler :: Dsl :: DSLError en réécrivant gemfile
Comment effacer l'image de test après avoir exécuté le test Rspec à l'aide de CarrierWave
Comment gérer différentes versions de rbenv et Ruby