投稿

5月, 2021の投稿を表示しています

5月25日(火)1、2コマ目

イメージ
今日の予習 C#のクラス 以下のサイトが参考になります。 [C#プログラミングガイド]classキーワード C#のクラスのメンバ 以下のサイトが参考になります。 [C#プログラミングガイド]クラスのメンバ 今日、やったこと C#のクラス 今日のホワイトボード C#のクラス 今日のポイントはC#のプロパティ。Javaのフィールドとsetter、getterがひとまとめになったもの。 図 クラス内のプロパティ 図 Javaのフィールド+setter、getter = C#のプロパティ Listはstring以外も可 Listの宣言時に<>内には要素の型を指定する。前回はstringだったが、クラスを指定することもできる。 ①~.cshtml.cs側で選択肢のListのプロパティを用意 図 ~.cshtml.cs側 ②~.cshtml側ではプロパティから選択肢を取得、表示 図 ~.cshtml サンプルコード 一応、のせときます。 Coffee.cs(Coffeeクラス) Size.cs(Sizeクラス) Index.cshtml.cs Index.cshtml

5月21日(金)1、2コマ目

イメージ
今日、やったこと ~.cshtml.csのOnGet() Listクラス ~.cshtml.csのOnPost() ~.cshtml、~.cshtml.csのライフサイクル 今日のホワイトボード ~.cshtml.csのOnGet() 選択リストに表示する選択肢をプログラム的に作成するには、~.cshtml.csのOnGet()メソッド内で実行する。 OnGet()メソッドはHttpのGETコマンドリクエスト時に実行されるメソッド。 HTTPのGETコマンドはブラウザでページへのリンクをクリックしたときやURLを入力してアクセスする場合に送信される。 図 GETコマンド送信時は~.cshtml.csのOnGet()メソッドが動く Listクラス 複数のデータをひとまとめにするには配列がある。 C#には(Javaも)配列以外にコレクションクラスと呼ばれる、複数のインスタンスをひとまとめにできるクラスがある。Listクラスはそのなかの1つ。 Listクラスは配列と違って要素数を意識する必要がない。 図 Listクラス ~.cshtml.csのOnPost()メソッド ブラウザ上のボタンをクリックすると、HTTPのPOSTコマンドが送信される。POSTコマンド送信時は~.cshtml.csのOnPost()メソッドが実行される。 図 ボタンクリック時は~.cshtml.csのOnPost()が実行 ボタンクリックでPOSTコマンドが送信される場合、一緒にブラウザで入力・選択したデータが送信される。 OnPost()メソッドでは、引数で送信データを受け取ることができる。 ただし、HTMLのname属性設定値と同じ名前の引数にする必要がある。 OnPost()メソッドのポイント ...

5月18日(火)1、2コマ目

イメージ
今日、やったこと @functionsディレクティブ ~.cshtml.csのプロパティで~.cshtmlへデータを渡す ~.cshtml.csのOnGet()、OnPost()メソッド 今日のホワイトボード @functionsディレクティブ @functions{ }内にメソッドが作れる。 図 @functionsディレクティブにメソッド作成(引数なし) 引数があるメソッドも当然OK。 メソッド呼び出しはC#のコードを書く時と同じ感じで。 図 @functionsディレクティブにメソッド作成(引数あり) 授業ではメソッドを作っただけだが、プロパティ作成や変数宣言も可能。 ただ、使うのか?と言われると微妙な感じ。そもそも~.cshtmlにメソッドを作ること自体がNGな気もする。 @functionsは「こんなものもある」程度で。 @functionsディレクティブの演習 解答例をあげときます。 (くどいけど)3項演算子 どんだけ3項演算子推しやねん!ですが、前回に続き今回も。 ~.cshtmlでは使えると思います。 図 3項演算子  ~.cshtml.cs Razorページを追加すると、 ~.cshtml ~.cshtml.cs のペアが追加されます。 今まで使っていた~.cshtmlには...

5月11日(火)1、2コマ目

イメージ
今日、やったこと コードブロック、コードナゲット 今日のホワイトボード Razorページのプロジェクト作成 前回はテンプレートに「ASP.NET Core Webアプリ」を選択しました。 このテンプレートは余分なモノが結構あるため、これからは「 ASP.NET Core(空) 」を選択してください。 また、「 HTTPS用の構成 」にデフォルトでチェックが入っています。 チェックを外して ください。 図 Razorページのプロジェクト作成 Razorプロジェクトのフォルダ構成 Razorページは Pagesフォルダ 内に保存します。 画像ファイルやHTMLファイル、CSSファイル等の静的ファイルは wwwrootフォルダ 以下に保存します。 プロジェクト作成後、まずは Startup.csを編集 してください。 図 Razorページプロジェクトのフォルダ構成 コードブロック ~.cshtml内で @{ } 内にはC#のコードが書けます。 ただし、HTMLタグで始まる行はHTMLとみなします。 この@{ }をコードブロックと呼びます。 コードブロックには @for(・・){ } や @foreach(・・){ } の繰り返し、 @if(・・){ } の条件分岐があります。 図 コードブロック コードナゲット HTML中に @変数名 や @メソッド名() と書くと、変数データやメソッド戻り値をHTMLに埋め込むことができます。 コードナゲットは @で始まり、C#の名前に使えない文字までです。 不用意に使うとここでハマりますのでご注意を。 また、@( )のように( )で括ると( )内をさきに実行します。  図 コードナゲット 3項演算子って知ってますか? 使ってはいけないアイテムにされたりしますが、コードナゲットとの組み合わせは結構協力です。 図 3項演算子 演習 コードブロック、コードナゲットを使った演習をしました。 練習1 繰り返しのコードブロック(@for(){ })と明示的なRazor式で作成可能。 練習2 画像ファイルは静的ファイル。よって、以下が必要。 Startup.csのConfigure()メソッドにて、app.UseStaticFiles()実行 wwwroo...