##前回まで
前回までで画面を表示させるところまで完成しました。
【PHP】Laravel学習メモ / 簡易アプリで流れを掴む１（表示まで）
##今回で完成
今回は、入力されたデータ（米ドル）を受け取り、日本円に換算して表示するところまで実装して、完成としたいと思います。為替は、今回１ドル＝110円として計算します。
##完成動画
コードを追ってみましょう。
##ルーティング
ルーティングは前回で終わっているので、そのまま使います。
本来Webサービス、アプリではもっと多くのルーティングを設定しますが、今回のアプリはトップページのみで動かす為、１行のみです。
routes/web.php
Route::get('/', function () {
return view('welcome');
});
Route::get('/calculate', 'CalculateController@getcalc');
##コントローラー、ビュー
###コントローラー
app/Http/Controllers/CalculateController.php
<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
class CalculateController extends Controller
{
public function getCalc(Request $request){
$data['exchange'] = $request->input('usdoller');
$data['jpyen'] = ($data['exchange'] * 110);
return view('calculate.num', $data);
//
}
}
###ビュー
resources / views /calculate / num.blade.php
<head>
<title>計算アプリ</title>
</head>
<body>
<h1>計算アプリです</h1>
<h2>米ドルを入力すれば日本円に換算します</h2>
<div>
<form>
<input type="text" name="usdoller" placeholder="$0" style="height: 30px; width: 120px;">
<button type="submit">円に換算</button>
</form>
<p>日本円で{{ number_format($jpyen)}}円です</p>
</div>
</body>
</html>
#####では、１つずつ見ていきます。
###コントローラー
まず、コントローラーを順に見ていくと、viewから'usdoller'というデータを受け取っています。後ほどビューで見ますが、この中にはユーザーが入力した米ドルの金額が入っています。
その受け取ったデータを$data['exchange']に代入しています。
app / Http / Controllers / CalculateController.php
$data['exchange'] = $request->input('usdoller');
そして、'jpyen'にはusdollerに110（為替レート)を掛けたものを代入しています。
$data['jpyen'] = ($data['exchange'] * 110);
最後に、ビューに$dataを一緒に渡します。
return view('calculate.num', $data);
２つのデータを受け取っていますので、$data[ ]の中身は２つ入っています。
$data['exchange', 'jpyen']
ビューで表示したいのは、計算結果が入っている'jpyen'です。
'jpyen'を表示させるようにしましょう。
では、ビューを見てみます。
###ビュー
まず、入力欄とボタンを実装しています。ここは特に変わったことはしていません。ここで入力された金額が、コントローラーの$request->input()に渡されます。
resources / views /calculate / num.blade.php
<form>
<input type="text" name="usdoller" placeholder="$0" style="height: 30px; width: 120px;">
<button type="submit">円に換算</button>
</form>
コントローラーから渡されたデータを表示します。bladeファイルでは、{{ $データ }}で受け取ったデータを表示させることができます。number_formatは、数字の位をカンマで分けてくれる関数です。
<p>日本円で{{ number_format($jpyen)}}円です</p>
以上で完成です。
##データの流れまとめ
・ビューのinputで入力されたデータはsubmitでコントローラーへ渡す。
・コントローラーでは$request->input()でデータを受け取る。
・受け取ったデータを、$data[]に代入する。
・為替の計算をし、return view(ビューのファイル, $data);でビューに渡す。
・ビューでは{{ $データ }}でデータを表示する。