혼잣말 어플리케이션을 만들어 보도록 하겠습니다. ③.
10889 단어 Rails
우선 new 동작을 사용하여 투고 화면으로 이동하는 페이지를 만듭니다.
라우팅 설정
config/routes.rb
Rails.application.routes.draw do
root to: 'tweets#index'
resources :tweets, only: [:index, :new, :create] #のちにクリエイトアクションも使うので記入
end
컨트롤러 설정
app/controllers/tweets_controller.rb
class TweetsController < ApplicationController
def index
@tweets = Tweet.all
end
def new
@tweet = Tweet.new
end
end
app/views/tweets에서 new.html.erb라는 보기 파일을 만듭니다.app/views/tweets/new.html.erb
<div class="contents_form">
<div class="container_box">
<h3>投稿する</h3>
<%= form_with(model: @tweet, local: true) do |form| %>
<%= form.text_field :name, placeholder: "ニックネーム", class: 'container'%>
<%= form.text_area :text, placeholder: "text", rows: "10", class: 'container'%>
<%= form.submit "つぶやく", class: 'container'%>
<% end %>
</div>
</div>
create 작업으로 데이터 저장
양식에 전송된 데이터에 따라 기록을 저장합니다.
매개변수 선택
지정된 키만 허용하는 매개변수를 제한합니다.
제한을 두지 않으면 필요하지 않은 매개 변수까지 받을 수 있다
무의식중에 변경될 수 있습니다.
require 방법
보내는 매개 변수에서 어떤 정보를 얻을 수 있는지 선택하는 방법
선택한 패스 매개변수로 사용할 때 모델 이름을 주로 지정합니다.
params.require(:モデル名)
permit 방법
더욱 세밀한 제한을 하는 데 쓰인다.
검색할 키를 지정할 수 있습니다. 지정한 키와 값의 집합만 검색합니다.
params.require(:モデル名).permit(:キー名, :キー名)
획 파라미터는 그것들을 방법으로 묘사하지만, 그것들은 특수한 묘사법이다.전용 방법
클래스 밖에서 호출할 수 없는 방법
다음은private라고 기술된 코드는 개인 방법입니다.
app/controllers/tweets_controller.rb
class TweetsController < ApplicationController
def index
@tweets = Tweet.all
end
def new
@tweet = Tweet.new
end
def create
Tweet.create(tweet_params)
end
private
def tweet_params
params.require(:tweet).permit(:name, :text)
end
end
투고 완성 화면을 만들기 위해서.app/views/tweets에서create.html.erb라는 보기 파일을 만듭니다.
app/views/tweets/create.html.erb
<div class="contents">
<div class="success">
<h3>投稿が完了しました。</h3>
<a class="btn" href="/">投稿一覧へ戻る</a>
</div>
</div>
빈 트위터 투고가 없도록 검증을 설정하자.검증
데이터를 등록할 때는 일정한 제한을 받아야 한다.
너는 빈 데이터를 등록하지 못하거나 글자 수 제한을 추가할 수 있다.
설명은 다음과 같습니다.
validates :カラム名, バリデーションの種類
app/models/tweet.rbclass Tweet < ApplicationRecord
validates :text, presence: true
end
이렇게 하늘의 혼잣말이 안 된다.css 파일 정리를 맞혀보세요.
.btn,
.post {
padding: 8px 20px;
font-size: 14px;
border: 2px solid #57C3E9;
color: #57C3E9;
font-weight: bold;
text-align: center;
border-radius: 3px;
display: inline-block;
}
.btn:hover,
.post:hover {
border-color: #9bdbf2;
color: #9bdbf2;
}
footer {
margin: 30px auto;
padding: 10px;
color: #D8D8D8;
text-align: center;
}
header {
margin: 30px auto;
padding: 10px;
color: #D8D8D8;
text-align: center;
}
.content_post {
text-align: center;
}
.container_box {
text-align: center;
}
.container {
margin: auto;
display: block;
}
.contents {
text-align: center;
}
아래의 행동이라면 성공이다.여기서 마치겠습니다.
Reference
이 문제에 관하여(혼잣말 어플리케이션을 만들어 보도록 하겠습니다. ③.), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://qiita.com/masakichi_eng/items/56de0c907ad02a39b0e3텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)