0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 1 year has passed since last update.

[Laravel10] HTMLファイルで、値の有無で表示を分岐させる便利な方法。(null合体演算子)

Last updated at Posted at 2024-04-17

今回は、HTMLファイルで、変数の値の有無(値が存在する場合とnullの場合)で表示を分岐させる便利な方法をご紹介します!

開発環境

  • aws Cloud9
  • PHP 8.2.15 (cli)
  • laravel/framework v10.45.1 The Laravel Framework
  • javascript
  • mariadb105-server-10.5.23-1.amzn2023.0.1.x86_64
  • cloudinary-labs/cloudinary-laravel 2.0.3 A Laravel Cloudinary Package

前提

  • 今回の処理は、$post が存在していれば、以前に入力した値をテキストボックスに表示し、$post が存在していなければテキストボックスが空になるというものです。

課題

<!-- 修正前の記述 -->

<div class="post-body">
    <!-- 以下、修正部分-->
    @if($post)
        <input type="text" name="post[body]" placeholder="今日はどんな天気でしたか?" value="{{ old('post.body', $post->body) }}" /><br/>
    else
        <input type="text" name="post[body]" placeholder="今日はどんな天気でしたか?" value="" /><br/>
    @endif
</div>

解決事例

<!-- 修正後の記述 -->

<div class="post-body">
    <!-- 以下、修正部分-->
    <input type="text" name="post[body]" placeholder="今日はどんな天気でしたか?" value="{{ old('post.body', $post->body ?? '') }}" /><br/>
</div>

説明

  • 修正前の記述

このコードは、条件に応じて投稿の本文を表示するためのものです。
投稿が存在する場合($post 変数が true の場合)、投稿の本文を表示します。投稿が存在しない場合($post 変数が false の場合)、空の投稿フォームを表示します。

投稿フォームの入力欄には、$post->body の値が表示されます。また、フォームが再表示された場合に、ユーザーが以前入力した値を保持するために old() ヘルパーを使用しています。

条件文 @if($post)$post 変数が定義されていることを確認します。
定義されている場合は投稿の本文 を表示し、定義されていない場合は の入力欄を表示します。

  • 修正後の記述

修正されたコードは、投稿の本文を表示するための入力フォームです。
$post->body の値がフォームに表示され、フォームが再表示された場合には old() ヘルパーを使用して以前の入力値を保持します。

$post->body の代わりに $post->body ?? '' を使用しています。
これにより、$post 変数が null の場合でもエラーが発生しないようになります。

次に、「?? ‘’」 についての簡単な説明です。

  • 「?? ‘’」で値が存在する場合とnullの場合を条件分岐

?? ''は、PHPにおいてnull合体演算子(null coalescing operator)として使われます。これは、左側の式がnullであれば右側の式を返し、そうでなければ左側の式を返すという意味です。具体的には、左側の式がnullまたは未定義の場合に右側の式が返されます。

例えば、以下のようなコードがあります:

$value = null;
$result = $value ?? 'default';
echo $result;

この場合、$value はnullなので、$result には 'default' が代入され、結果として 'default' が出力されます。

'' は空の文字列を表します。したがって、?? ''左側の値がnullである場合に空の文字列を返すという意味になります。

結論

HTMLファイルで、変数の値の有無(値が存在する場合とnullの場合)で表示を分岐させるときは、if文で条件分岐させるのではなく、?? ''を使うことができます!🙌

*何か間違えなどがございましたらコメント欄にてご連絡ください。

0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?