[RUBY] Bildregistrierung? Natürlich kann (kann) ich nicht ~ part2 ~

Annahme

--Verwenden Sie Rubin auf Schienen 6.0.0.

Einführung

Die Einführung und das Verfahren sind in Teil1 beschrieben, daher werde ich die Implementierung sofort fortsetzen. Wenn Sie interessiert sind, lesen Sie es bitte.

Der zweite Teil der Prozedur, Teil 2, lautet "Implementieren der Bildbuchung durch Zuordnen der Bildtabelle".

Ich registriere das Bild nur in einer separaten Tabelle, aber die Implementierung hat ungefähr 30.000 Jahre gedauert, daher möchte ich das richtige Verfahren für die Nachwelt belassen.

Lass uns anfangen

Lassen Sie uns heute unser Bestes geben.

$ rails g model image $ rails db:migrate

Erstellen Sie zunächst ein Bildmodell und migrieren Sie es. Wie beim letzten Mal wird die Beschreibung der Migrationsdatei weggelassen.

Als nächstes werde ich die Modellstruktur erklären.

app/models/product.rb


class Product < ApplicationRecord
  belongs_to :user
  has_many :images
end

app/models/image.rb


class Image < ApplicationRecord
  belongs_to :product
end

Wie Sie oben sehen können, gibt es eine Eins-zu-Viele-Beziehung, in der Sie mehrere Bildmodelle für ein Produktmodell haben können. (Die Validierung ist aus Gründen der Übersichtlichkeit weggelassen.) In der Bildtabelle entspricht ein Datensatz einem Bild, und jedem ist die Produkt-ID zugeordnet.

Nachdem Sie eine ungefähre Vorstellung von der Struktur haben, bereiten wir das Hochladen des Bildes in die lokale Umgebung vor.

Gemfile


~Kürzung~
gem 'carrierwave'
gem 'mini_magick'

Erstens ist die Einführung von Edelsteinen. Dieses Mal möchte ich den Uploader von Carrierwave verwenden, um Bilder hochzuladen.

$ bundle install $ rails g uploader image

Vergessen Sie nicht, eine Bandle-Installation durchzuführen und dann die Uploader-Datei zu generieren. Um diese richtig zu verwenden, fügen wir der generierten Uploader-Datei und dem vorherigen Modell eine Beschreibung hinzu.

app/models/image.rb


class Image < ApplicationRecord
  belongs_to :product
  mount_uploader :src, ImageUploader
end

Wenn Sie so schreiben, können Sie ImageUploader in der Spalte src des Bildmodells verwenden.

app/uploaders/image_uploader.rb


include CarrierWave::MiniMagick
process resize_to_fit: [50, 50]

Dies ist die Mini Magick-Einstellung. Es ist ein praktisches Juwel, mit dem Sie die Größe des hochgeladenen Bildes anpassen können. Anstatt oben eine neue Zeile hinzuzufügen, finden Sie diese Beschreibung im Kommentar und kommentieren sie aus. (Sie können den Inhalt der Größenänderung frei anpassen)

Nachdem Sie sich selbst hochladen können, erstellen wir ein Formular, um das Bild tatsächlich zu veröffentlichen.

app/models/product.rb


class Product < ApplicationRecord
  belongs_to :user
  has_many :images, dependent: :destroy
  accepts_nested_attributes_for :images, allow_destroy: true
end

haml:app/views/products/_form.html.haml


= form_with model: @product, local: true do |f|
  = f.text_field :name, placeholder: 'name'
  = f.fields_for :images do |i|
    = i.file_field :src
  = f.submit 'SEND'

So etwas wie fields_for kam heraus. Dies ist ein Formular-Helfer, mit dem Daten in mehreren Tabellen gespeichert werden können, die gleichzeitig einer Tabelle zugeordnet sind. Um es zu verwenden, fügen Sie zuerst die Beschreibung accept_nested_attributes_for zum übergeordneten Modell hinzu. Lassen Sie uns ein untergeordnetes Modell mit dem Faktor verknüpfen. Der folgende Teil allow_destroy ist eine praktische Funktion. Wenn Sie ihn auf true setzen und der übergeordnete Datensatz gelöscht wird, werden die zugehörigen untergeordneten Datensätze gleichzeitig gelöscht.

app/controllers/products_controller.rb


#~Kürzung~
  def new
    @product = Product.new
    @product.images.new
  end
#~Kürzung~
  def product_params
    params.require(:product).permit(:name, images_attributes: [:src]).merge(user_id: current_user.id)
  end 
#~Kürzung~
end

Wir werden einige Änderungen an der Steuerung entsprechend den zu verarbeitenden Daten vornehmen. Zunächst haben wir im neuen Aktionsteil eine Beschreibung hinzugefügt, mit der eine neue Image-Instanz für das Produkt erstellt wird. Beachten Sie, dass das Bild ohne dies nicht korrekt im Bild gespeichert wird. Und es ist ein starker Parameter. Dies ist eine kleine spezielle Beschreibung. _attributes: [:] bedeutet, die Spalten des zugeordneten Modells anzugeben. Ich denke, es ist in Ordnung, wenn Sie es als Set betrachten, wenn Sie das Formular helper fields_for verwenden.

Damit ist die Bildpostfunktion abgeschlossen. Bei dieser Geschwindigkeit kann jedoch nur ein Bild ausgewählt werden, sodass ich es beim nächsten Mal aktualisieren möchte.

Schließlich

Dieses Mal habe ich ein Bildmodell erstellt, das Bild tatsächlich in einem Formular gesendet und es bis zum Speichern in der Datenbank implementiert.

Ich dachte, es wäre schwierig, nur die Buchstaben zu verstehen, deshalb wollte ich Referenzbilder und Gifs hinzufügen. Ich bin gerade ein bisschen beschäftigt, also mache ich es, wenn ich es mir leisten kann. (Vielleicht)

In Teil 3 werden wir endlich jQuery vorstellen. Lassen Sie uns ein Formular erstellen, mit dem Sie mehrere Bilder veröffentlichen können, indem Sie mit dem Display herumspielen! Es ist wie es ist. Ich werde mein Bestes geben.

Wir sehen uns im nächsten Teil. Vielen Dank.

Ich möchte eine Funktion zum Bearbeiten von Produktinformationen implementieren ~ part3 ~

Recommended Posts

Bildregistrierung? Natürlich kann (kann) ich nicht ~ part2 ~
Ich habe ein Docker-Image für die japanische Version von SDAPS erstellt
Ich bin mir der Bequemlichkeit des Graphql-Code-Generators Teil 2 sehr bewusst
Ich kann den Bildschirm der Rails-Datenbankkonsole nicht verlassen