Python, Algorithmen, Wettbewerbsprogrammierung, Datenstruktur [Rails] Favoritenregistrierung und Favoritenliste anzeigen Volumen Einführung Wenn Sie ein Produkt finden, das Ihrer Meinung nach für den Online-Einkauf geeignet ist, haben Sie es als Favorit registriert? Zu diesem Zeitpunkt ändert sich die Farbe der Markierung ♡, wenn der Bildschirm nicht aktualisiert wird und Sie ihn mögen oder mögen. Danach wäre es schön, wenn Sie Ihre Lieblingsprodukte in einer Liste überprüfen könnten. Diese Zeit ist ein Memo der Implementierung. * Wir gehen davon aus, dass die Listen- und Buchungsfunktionen (Artikeltabelle) und die Anmeldefunktion (Benutzertabelle) bereitgestellt werden.
Wenn Sie auf das fertige Bild klicken, wird ein Teil des Bildschirms aktualisiert und die Anzahl erhöht. Es hat auch eine Löschfunktion. Wir erstellen auch eine Seite, auf der Sie überprüfen können, was Sie Ihren Favoriten in einer Liste hinzugefügt haben.
Erstens als Zwischentabelle zwischen der Elementtabelle und der Benutzertabelle Erstellen Sie eine Likes-Tabelle.
↓ Die hinzuzufügenden Spalten und Assoziationen sehen folgendermaßen aus ↓
Column | Type | Options |
---|
=== Ausgelassen ===
Column | Type | Options |
---|---|---|
item_id | integer | null: false |
user_id | integer | null: false |
Association
Column | Type | Options |
---|
=== Ausgelassen ===
Association
Damit ist das DB-Design abgeschlossen Erstellen Sie als Nächstes ein Modell. Geben Sie den folgenden Befehl in das Terminal ein
rails g model like
Bearbeiten Sie die Migrationsdatei, um eine Tabelle zu erstellen
2XXXXXXXXXXXX5_create_likes.rb
class CreateLikes < ActiveRecord::Migration[5.2]
def change
create_table :likes do |t|
t.integer :item_id, null: false
t.integer :user_id, null: false
end
end
end
Schienen von db: migrieren. Dann wird ein Modell generiert, also schreibe ich eine Assoziation.
user.rb
has_many :likes #hinzufügen
item.ruby
has_many :likes #hinzufügen
like.rb
class Like < ApplicationRecord
belongs_to :item
belongs_to :user
validates :user_id, presence: true
validates :item_id, presence: true
validates_uniqueness_of :item_id, scope: :user_id
def self.like_method(item, user)
Like.find_by(item_id: item.id, user_id: user.id)
end
end
self.like_method(item, user) Ich werde die IF-Anweisung hier setzen. Stellen Sie die Bedingung ein, dass sich item_id und user_id in der Like-Tabelle befinden! Führen Sie dann den folgenden Befehl aus, um den Controller zu erstellen
rails g controller likes
Sobald der Controller erfolgreich erstellt wurde · Datei ansehen ·Regler · Routing Ich werde jeden einstellen.
routes.rb
- Ausgelassen ---
resources :items, only: [:new, :create, :edit, :update, :show, :destroy] do
resources :likes, only: [:create, :destroy]
end
- Ausgelassen ---
resources :users, only: [:show] do
resources :likes, only: [:index]
end
- Ausgelassen ---
erstellen und zerstören sind in Gegenständen verschachtelt In Benutzern verschachtelter Index
likes_controller.rb
class LikesController < ApplicationController
before_action :set_item, only: [:create, :destroy]
def index
@items = Item.includes(:item_images).order("created_at DESC")
end
def create
@like = Like.create(item_id: params[:item_id],user_id: current_user.id)
redirect_to item_path(@item.id)
end
def destroy
@like = Like.find_by(item_id: params[:item_id],user_id: current_user.id)
@like.destroy
redirect_to item_path(@item.id)
end
def set_item
@item = Item.find(params[:item_id])
end
end
Da beim Erstellen und Zerstören keine Ansichtsdatei vorhanden ist, müssen Sie Weiterleitungen festlegen.
index.html.haml
- Ausgelassen ---
- if user_signed_in? && Like.like_method(@item, current_user)
.check_btn__like--add{data: {item_id: @item.id}}
= link_to "/items/#{@item.id}/likes/:id" , method: :DELETE do
= icon( "fa", "star")
Favorit
= @item.likes.length
- elsif user_signed_in?
.check_btn__like{data: {item_id: @item.id}}
= link_to "/items/#{@item.id}/likes", method: :POST do
= icon( "fa", "star")
Favorit
= @item.likes.length
- else
.check_btn__like
= link_to new_user_session_path do
= icon( "fa", "star")
Favorit
= @item.likes.length
- Ausgelassen ---
Klicken Sie hier, um den Bildschirm anzuzeigen, wenn Sie sich als Favorit registrieren
index.html.haml
.mypage_Wrapper
%section.mypage_title
Favoritenliste
%section.like_Wrapper
.like__box
- @items.each do |item|
- if user_signed_in? && Like.like_method(item, current_user)
.like__box__product
.like__image
= link_to item_path(item.id) do
= image_tag item.item_images[0].image.url
.like__name
= item.name
%ul
%li
= item.price.to_s
%li
= "Kreis"
%li.like__tax
= "(Steuern inklusive)"
%li.like__icon
= link_to "/items/#{item.id}/likes/:id" , method: :DELETE do
= icon("fas", "star")
.bottom_Wrapper
Dies sehen Sie in Ihrer bevorzugten Produktliste
like.scss
.like_Wrapper {
width: 100%;
}
.like__box {
background-color:white;
margin: 0 auto;
width: 65%;
display: flex;
justify-content: center;
flex-wrap: wrap;
&__product {
width: 180px;
height: 90%;
margin: 25px 2% 0;
transition: all .3s ease-in-out;
.like__image {
width: 180px;
height: 140px;
margin-bottom: 3%;
img{
width: 100%;
height: 100%;
object-fit: cover;
}
}
.like__name {
font-weight: bold;
}
ul{
display: flex;
font-size: 16px;
li{
font-weight: bold;
}
.like__tax {
font-size: 10px;
writing-mode: lr-tb;
width: 30px;
line-height: 30px;
margin-left: 2%;
margin-right: 24%;
}
.like__icon {
i {
font-size:1.1em;
color: orange;
}
}
}
}
&__product:hover {
cursor: pointer;
transform: scale(1.1, 1.1);
}
}
Vorerst CSS Ich denke, dass es in einem synchronisierten Zustand mit der bisherigen Implementierung implementiert werden kann! Wenn Sie die asynchrone Kommunikation mit Ajax implementieren, ist sie bisher umfangreicher. Ich wünschte, ich könnte das schreiben ... Es wird später sein ...
https://techtechmedia.com/favorite-function-rails/#i https://qiita.com/naberina/items/c6b5c8d7756cb882fb20 https://qiita.com/hisamura333/items/e3ea6ae549eb09b7efb9 https://qiita.com/shh-nkmr/items/48fe53282253d682ecb0
Recommended Posts