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

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

新規登録して質問してみよう
ただいま回答率
85.48%
Node.js

Node.jsとはGoogleのV8 JavaScriptエンジンを使用しているサーバーサイドのイベント駆動型プログラムです。

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

Express

ExpressはNode.jsのWebアプリケーションフレームワークです。 マルチページを構築するための機能セットおよびハイブリッドのWebアプリケーションを提供します。

Q&A

解決済

1回答

5974閲覧

Express、Node.jsのrenderについて

退会済みユーザー

退会済みユーザー

総合スコア0

Node.js

Node.jsとはGoogleのV8 JavaScriptエンジンを使用しているサーバーサイドのイベント駆動型プログラムです。

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

Express

ExpressはNode.jsのWebアプリケーションフレームワークです。 マルチページを構築するための機能セットおよびハイブリッドのWebアプリケーションを提供します。

0グッド

0クリップ

投稿2017/11/18 12:50

dotinstallでexpressの基礎を学んでいるのですが、renderとreq.params.がはっきりと理解できておりません。もしよろしければご教授いただきたいです。

Javascript

1//app.js 2//※省略 3app.get('/', post.index); 4app.get('/posts/:id([0-9]+)', post.show); 5//※省略

Javascript

1//post.js 2//※省略 3var posts = [ 4 {title:'title0',body:'body0'}, 5 {title:'title1',body:'body1'}, 6 {title:'title2',body:'body2'} 7]; 8 9exports.index = function(req,res){ 10 res.render('posts/index',{posts:posts}); 11}; 12 13exports.show = function(req,res){ 14 res.render('posts/show',{post:posts[req.params.id]}); 15}; 16//※省略

Javascript

1//index.ejs 2//※省略 3<h1>Posts</h1> 4<ul> 5<% for (var i=0; i<posts.length; i++) 6<li> 7 <a href="/posts/<%= i %>"><%= posts[i].title %></a> 8 <input type="hidden" name="id" value="<%= i %>"> 9 <input type="hidden" name="_csrf" value="<%= csrftoken%>"> 10 </form> 11</li> 12<% } %> 13</ul> 14//※省略

Javascript

1//show.ejs 2//※省略 3<h1><%= post.title %></h1> 4<p><%= post.body %></p> 5//※省略

無知のため、間違いなどあると思いますが、今私が理解できている処理の流れを書かせていただきます。
まず、urlがindexの際はapp.jsのapp.get('/', post.index);でpost.jsファイルのindexメソッドが呼ばれ
index.ejsファイルを読み込み?、第二引数にはindex.ejsにpostsの配列を渡す。
そしてforでループし、順番に配列の中身を取り出していく。
生成されたリンクをクリックすると、urlが/posts/<%= i(整数) %>にアクセスし、
app.jsの、app.get('/posts/:id([0-9]+)', post.show);でpost.jsファイルのshowメソッドが呼ばれる。
ここからが理解できていません。
この時に渡すデータとしてpost:posts[req.params.id]とありますが、
postsの配列にidというキーはなく、またshow.ejsではtitleやbodyも呼び出しています。
渡したのはidとあるのでpost:整数ではないのかと思うのですが、この
post:posts[req.params.id]は何をどのようにしてshow.ejsへ渡しているのでしょうか?

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

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

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

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答1

0

ベストアンサー

index.ejsにPostsとありますが、
<input type="hidden" name="id" value="<%= i %>">のidをPostメソッド(?)で渡したいのかな??

見たところapp.getなのでGetメソッドになるのですが、
何か渡したいときはURLに値を含める必要があります。

showにidを渡したいならば'/posts/:id([0-9]+)とある通り、
posts/123という風にアクセスするとreq.param.idに123が渡されると思います。

投稿2017/11/18 14:44

編集2017/11/18 14:46
momf

総合スコア416

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

退会済みユーザー

退会済みユーザー

2017/11/19 06:55

index.ejsからpostメソッドで渡しています。 わかりやくす解説していただきありがとうございました。 無事理解することができました。
momf

2017/11/19 11:47

postメソッドをサーバーコードが受け付けてるようなものは見当たりませんが... あとformタグもどこから始まってるのかな、って思いました
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

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

ただいまの回答率
85.48%

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

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

質問する

関連した質問