質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
87.20%
Ruby on Rails 6

Ruby on Rails 6は、オープンソースのWebアプリケーションフレームワークです。「同じことを繰り返さない」というRailsの基本理念のもと、他のフレームワークより少ないコードで簡単に開発できるよう設計されています。

解決済

投稿した画像やテキストをindex.html.erbで表示させたい

tt0913
tt0913

総合スコア6

Ruby on Rails 6

Ruby on Rails 6は、オープンソースのWebアプリケーションフレームワークです。「同じことを繰り返さない」というRailsの基本理念のもと、他のフレームワークより少ないコードで簡単に開発できるよう設計されています。

1回答

0評価

0クリップ

226閲覧

投稿2022/03/16 10:31

編集2022/03/16 22:31

現在WEBアプリケーションを作成しており、投稿機能を実装しております。
しかし投稿した画像やテキストがviewに表示されません。
なお画像投稿にはActive Storageを導入しております。
投稿した内容もシークエルプロで確認したところ保存されております。

実際のエラー文は以下です。イメージ説明
関係するファイルを添付させて頂きます。

views/tweets/index.html.erb

<link href="https://fonts.googleapis.com/css?family=DM+Sans:400,500,700&display=swap" rel="stylesheet"> <div class="app-wrapper"> <div class="left-area hide-on-mobile"> <div class="app-header">Aller<br> <span class="inner-text">a</span> <button class="close-menu"> <svg width="24" height="24" fill="none" stroke="#51a380" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" class="feather feather-x"> <defs /> <path d="M18 6L6 18M6 6l12 12" /> </svg> </button> </div> <div class="left-area-content"> <div class="profile"> <%= image_tag '/assets/sample.jpeg' %> <div class="profile-info"> <span class="profile-name">名前さん</span> </div> </div> <div class="page-link-list"> <a href="#" class="item-link" id="pageLink"> <svg class="link-icon" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" class="feather feather-home" viewBox="0 0 24 24"> <defs /> <path d="M3 9l9-7 9 7v11a2 2 0 01-2 2H5a2 2 0 01-2-2z" /> <path d="M9 22V12h6v10" /></svg> マイページ</a> <a href="#" class="item-link" id="pageLink"> <svg class="link-icon" xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-heart"> <path d="M20.84 4.61a5.5 5.5 0 00-7.78 0L12 5.67l-1.06-1.06a5.5 5.5 0 00-7.78 7.78l1.06 1.06L12 21.23l7.78-7.78 1.06-1.06a5.5 5.5 0 000-7.78z" /> </svg> 記録</a> <a href="#" class="item-link" id="pageLink"> <svg class="link-icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-play"> <path d="M5 3l14 9-14 9V3z" /> </svg> おすすめメニュー</a> <a href="#" class="item-link" id="pageLink"> <svg class="link-icon" xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-list"> <path d="M8 6h13M8 12h13M8 18h13M3 6h.01M3 12h.01M3 18h.01" /> </svg> 寄付</a> <a href="#" class="item-link" id="pageLink"> <svg class="link-icon" xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-clock"> <circle cx="12" cy="12" r="10" /> <polyline points="12 6 12 12 16 14" /></svg> History</a> </div> </div> <button class="btn-invite">Invite Team</button> </div> <div class="right-area"> <div class="right-area-upper"> <button class="menu-button"> <svg width="24" height="24" fill="none" stroke="#51a380" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"> <defs /> <path d="M3 12h18M3 6h18M3 18h18" /> </svg> </button> <div class="search-part-wrapper"> <input class="search-input" type="text" placeholder="Search tweets..."> <a class="menu-links" href="#">検索</a> </div> <div class="action-buttons-wrapper"> <% if user_signed_in? %> <button class="action-buttons btn-record"><%= link_to current_user.nickname, root_path, class: "user-nickname" %></button> <button class="action-buttons btn-upload"><%= link_to 'ログアウト', destroy_user_session_path , method: :delete, class: "logout" %></button> <% else %> <button class="action-buttons btn-record"><%= link_to 'ログイン', new_user_session_path, class: "login" %></button> <button class="action-buttons btn-upload"><%= link_to '新規登録', new_user_registration_path, class: "sign-up" %></button> <% end %> </div> </div> <div class="page-right-content"> <div class="content-line content-line-hero"> <div class="line-header"> <span class="header-text">トップページ</span> </div> <div class="slider-wrapper owl-carousel owl-theme" id="owl-slider-1"> <div class="item hero-img-wrapper img-1"> <div class="upload-text-wrapper"> <p class="upload-text-info">Aller <span> a</span> <button class="btn-new-1"><%= link_to "つぶやき", new_tweet_path %></button> <button class="btn-new-2">寄付募集</button> </p> </div> <%= image_tag '/assets/food',:size => '500x300'%> </div> </div> </div> <div class="content-line content-line-list"> <div class="line-header"> <span class="header-text">つぶやき</span> </div> <div id="owl-slider-2" class="slider-wrapper owl-carousel"> <div class="item video-box-wrapper"> <div class="img-preview"> <%= image_tag @tweets.image %> </div> <div class="video-description-wrapper"> <p class="video-description-header"><%= @tweets.title %></p> <p class="video-description-subheader"><%#= "by#{tweet.user.name}" %></p> <p class="video-description-info">いいね <span><%#= tweet.created_at %></span></p> </div> </div> <div class="item video-box-wrapper"> <div class="img-preview"> <img src="https://images.unsplash.com/photo-1531736275454-adc48d079ce9?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=2250&q=80" alt="video"> </div> <div class="video-description-wrapper"> <p class="video-description-header">Puppet Theatre</p> <p class="video-description-subheader">By July</p> <p class="video-description-info">116K views <span>1 hour ago</span></p> </div> </div> </div> </div> <div class="content-line content-line-list"> <div class="line-header"> <span class="header-text">寄付</span> </div> <div id="owl-slider-3" class="slider-wrapper owl-carousel"> <div class="item video-box-wrapper"> <div class="img-preview"> <img src="https://images.unsplash.com/photo-1494252713559-f26b4bf0b174?ixlib=rb-1.2.1&auto=format&fit=crop&w=2250&q=80" alt="video"> </div> <div class="video-description-wrapper"> <p class="video-description-header">Minimal Photography</p> <p class="video-description-subheader">By July</p> <p class="video-description-info">116K views <span>1 hour ago</span></p> </div> </div> <div class="item video-box-wrapper"> <div class="img-preview"> <img src="https://images.unsplash.com/photo-1524678714210-9917a6c619c2?ixlib=rb-1.2.1&auto=format&fit=crop&w=2249&q=80" alt="video"> </div> <div class="video-description-wrapper"> <p class="video-description-header">Puppet Theatre</p> <p class="video-description-subheader">By July</p> <p class="video-description-info">116K views <span>1 hour ago</span></p> </div> </div> </div> </div> </div> </div> </div>

models/tweet.rb

class Tweet < ApplicationRecord belongs_to :user has_one_attached :image validates :title, presence: true validates :text, presence: true validates :image, presence: true end

controllers/tweets_controller.rb

class TweetsController < ApplicationController before_action :authenticate_user!, except: [:index] def index @tweets = Tweet.all end def new @tweet = Tweet.new end def create @tweet = Tweet.new(tweet_params) if @tweet.save redirect_to root_path(@tweet) else render :new end end private def tweet_params params.require(:tweet).permit(:image, :title, :text).merge(user_id: current_user.id) end end

config.routes.rb

Rails.application.routes.draw do devise_for :users root to: "tweets#index" resources :tweets end

migrate

class CreateTweets < ActiveRecord::Migration[6.0] def change create_table :tweets do |t| t.string :title, null: false t.text :text, null: false t.references :user, null: false, foreign_key: true t.timestamps end end end

エラー文の内容はimageが空?ということだと推測しますが
コントローラでimageの保存許可も行なっているのでどこが間違っているのか分からない状況です。
※@tweets.imageにしたり色々な記述を試しましたがうまくいきませんでした。

rails初心者で大変申し訳ございませんが、アドバイスやご指摘いただけますと幸いです。

どうぞよろしくお願いいたします。

良い質問の評価を上げる

以下のような質問は評価を上げましょう

  • 質問内容が明確
  • 自分も答えを知りたい
  • 質問者以外のユーザにも役立つ

評価が高い質問は、TOPページの「注目」タブのフィードに表示されやすくなります。

気になる質問をクリップする

クリップした質問は、後からいつでもマイページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

teratailでは下記のような質問を「具体的に困っていることがない質問」、「サイトポリシーに違反する質問」と定義し、推奨していません。

  • プログラミングに関係のない質問
  • やってほしいことだけを記載した丸投げの質問
  • 問題・課題が含まれていない質問
  • 意図的に内容が抹消された質問
  • 過去に投稿した質問と同じ内容の質問
  • 広告と受け取られるような投稿

評価を下げると、トップページの「アクティブ」「注目」タブのフィードに表示されにくくなります。

winterboum

2022/03/16 11:43

indexのviewはそれで全部?
tt0913

2022/03/16 12:47

コメントありがとうございます。 indexのviewを全て記載させて頂きました。 ご確認お願いします。

まだ回答がついていません

会員登録して回答してみよう

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
87.20%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問

同じタグがついた質問を見る

Ruby on Rails 6

Ruby on Rails 6は、オープンソースのWebアプリケーションフレームワークです。「同じことを繰り返さない」というRailsの基本理念のもと、他のフレームワークより少ないコードで簡単に開発できるよう設計されています。