--Utilisez ruby sur les rails 6.0.0.
Je fais une copie du site d'un certain site frima pour apprendre la programmation. J'ai implémenté une fonction d'édition des informations produit, mais j'ai eu du mal à publier plusieurs images, j'ai donc décidé de l'écrire comme référence. Bien que ce ne soit pas une grande quantité, il est divisé en parties afin que vous puissiez avoir un sentiment d'accomplissement lorsque vous le verrez plus tard. s'il vous plaît, pardonnez-moi. (J'ai beaucoup écrit! Je veux être) Je ne pense pas qu'il y ait quoi que ce soit qui reste coincé dans la partie 1, mais comme ce sera la base de la partie 2 et plus tard, je vais écrire sur l'échauffement.
1, création d'un contrôleur de base et d'un modèle. 2, implémentez la publication d'image en associant la table d'image. 3, Introduction de jQuery pour implémenter la publication de plusieurs images. 4, ajustement sur l'écran d'édition. 5, prévisualisez l'image.
Nous mettrons en œuvre chacune de ces cinq étapes séparément.
Eh bien
Tout d'abord, solidifiez la partie de base. D'abord depuis le terminal.
$ rails g contoroller products $ rails g model product $ rails db:migrate
C'est le flux habituel. Les détails tels que la création d'une base de données et la description d'un fichier de migration seront omis.
Commençons par le fichier racine.
app/config/routes.rb
Rails.application.routes.draw do
root "products#index"
resources :products
devise_for :users, controllers: {
registrations: 'users/registrations'
}
end
La partie conception est liée aux fonctions utilisateur qui ont été implémentées à l'avance, vous n'avez donc pas à vous en soucier. Aucune explication détaillée n'est nécessaire ici non plus. J'ai fait une action de base avec des ressources et spécifié une action d'index dans le chemin racine. (Cette fois, détruire et afficher ne sont pas utilisés, vous pouvez donc les exclure.)
Vient ensuite la description du contrôleur.
app/controllers/products_controller.rb
class ProductsController < ApplicationController
before_action :ensure_current_user, only[:edit, :update]
before_action :set_product, only[:new, :create, :edit, :update]
def index
@products = Product.all
end
def new
@prodcut = Product.new
end
def create
@product = Product.new(product_params)
if @product.save
redirect_to products_path
else
render :new
end
end
def edit
end
def update
if @product.update(product_params)
redirect_to products_path
else
render :edit
end
end
private
def product_params
params.require(:product).permit(:name).merge(user_id: current_user.id)
end
def ensure_current_user
product = Product.find(params[:id])
if product.user_id != current_user.id
redirect_to action: :index
end
end
def set_product
@product = Product.find(params[:id])
end
end
Est-ce un tel endroit pour le moment? Je vais vous expliquer étape par étape.
Tout d'abord, sur les actions de base.
@products = Product.all
Il n'y a pas de problème avec l'index, tous les enregistrements enregistrés dans la table product sont récupérés.
@prodcut = Product.new
Les produits sont enregistrés dans nouveau et créent. Créez un nouvel objet dans le modèle .new et attribuez-lui les valeurs de formulaire.
def product_params params.require(:product).permit(:name).merge(user_id: current_user.id) end
Les données envoyées de cette manière sont reçues par la méthode product_params. C'est un paramètre fort que tout le monde aime. La colonne n'est que nom car elle n'implémente que la fonctionnalité minimale.
if @product.save redirect_to products_path else render :new end
L'instruction if suivante, c'est celle appelée gestion des erreurs. Si le processus réussit, l'index s'affiche et si le processus échoue, nouveau s'affiche à nouveau. Il y a des parties compliquées dans le concept, mais je pense que vous connaissez déjà les fonctions.
@product = Product.find(params[:id])
Viennent ensuite les actions d'édition et de mise à jour, mais ce que nous faisons est le même qu'avant. La différence avec create est que vous n'avez pas besoin de créer un nouvel objet car les données existent déjà et que vous apportez le produit sélectionné par la méthode find.
def ensure_current_user product = Product.find(params[:id]) if product.user_id != current_user.id redirect_to action: :index end end
Enfin, la méthode ensure_current_user. Cela peut sembler difficile à première vue, mais le processus est très simple. Le fait est que si les informations utilisateur du produit sélectionné et les informations utilisateur connecté sont différentes, vous ne pouvez pas les modifier.
Maintenant que la description du contrôleur est terminée, il est temps d'écrire le fichier de vue.
haml:app/view/products/index.html.haml
- if user_signed_in?
- @products.each do |product|
- if product.user_id == current_user.id
= link_to edit_product_path(product.id) do
#{product.name}
= link_to("Référencement", new_product_path)
%h2 connecté
= link_to 'Se déconnecter', destroy_user_session_path, method: :delete
- else
%h2 non connecté
= link_to 's'inscrire', new_user_registration_path
= link_to 'S'identifier', new_user_session_path
Commençons par l'index, mais seules les six premières lignes doivent être notées. L'utilisateur est-il connecté? Le produit est-il enregistré par l'utilisateur? Sous deux conditions telles que, l'édition et les nouveaux chemins sont affichés.
haml:app/views/products/_form.html.haml
= form_with model: @product, local: true do |f|
= f.text_field :name, placeholder: 'name'
= f.submit 'SEND'
Je ne pense pas non plus qu'il y ait quelque chose de spécial à expliquer ici. Vous utilisez la méthode form_with pour envoyer des données au modèle de produit. Il ne vous reste plus qu'à afficher ceci comme modèle partiel dans new.html.haml et edit.html.haml comme rendu.
À ce stade, vous avez implémenté la possibilité de créer des données produit et de les modifier. (La colonne est juste le nom, mais ...)
Dans les spécifications,
Cela signifie que nous avons pu effacer ces trois éléments. Dans la partie suivante, nous pourrons ajouter des images (tableau d'images), veuillez donc rester en contact.
Je souhaite implémenter une fonction d'édition des informations produit ~ part2 ~
Recommended Posts