常連

### 実現したいこと
多人数チャット機能を作成しているのですが、チャットを立てた側が悪徳ユーザーだったりもう参加しないユーザーの強制退室を行えるような機能を考えています。
そこで複数の値を取得してループ文で回して、ユーザー名をクリックするとモーダルが開いてモーダルにもクリックしたユーザーの情報が送られるようにしたいです。

### 前提
現状はモーダルを開くとこまでは出来ているのですが、クリックしたユーザーの情報をモーダルに渡したいのですが、現状はどのユーザーをクリックしても最後に取得した参加者の情報が送られてきてしまいます。

### 発生している問題・エラーメッセージ
ユーザー名をクリックしてモーダルが開かれても配列の最後のユーザーの情報しか表示されない。

### 該当のソースコード

```room/show
<div class="room-enterning">
        @if($room->user_id == $user->id)
            <div class="acbox room-enterning-content"><input id="ac" type="checkbox" />
                <label for="ac">参加者</label>
                @foreach($myRoomMembers as $myRoomMember)
                    <div class="acbox-under room-enterning-list">
                        <h5><a href="#modal-{{ $myRoomMember->id }}" class="modal-button" >
                            {{ $myRoomMember->user->name }}
                        </a></h5>
                    </div>
                @endforeach
            </div>
        @endif
    </div>

 {{-- モーダル内容 --}}
<div class="modal-wrapper" id="modal-{{ $myRoomMember->id }}">
  <a href="#!" class="modal-overlay"></a>
  <div class="modal-window">
    <div class="modal-content">
        <p class="modal_title">{{ $myRoomMember->user->name }}</p>
        <form method="POST" action="{{ route('member.destroy', $myRoomMember->id) }}">
        @csrf
        @method('DELETE')
        <input type="hidden" id="user_id" name="user_id" value="{{$myRoomMember->id}}">
        <div class="flex items-center justify-end mt-4">
            <x-danger-button class="ms-4" onClick='return myMemberDeleteAlert();'>
                {{ $myRoomMember->user->name }}を強制退室
            </x-danger-button>
        </div>
        </form>
    </div>
    <a href="#!" class="modal-close"><i class="far fa-times-circle"></i></a>
  </div>
</div>
```
```room.css
/*モーダル表示*/
.modal-wrapper {
  z-index: 999;
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  padding: 40px 10px;
  text-align: center;
}

.modal-button {
    font-weight: bold;
    text-align: center;
    cursor :pointer;
    transition: all 0.3s;
    display: block;
    max-width:300px;
    text-decoration: none;
}

.modal-button:active {
  /*ボタンを押したとき*/
  -webkit-transform: translateY(2px);
  transform: translateY(2px);/*下に動く*/

}


/*ラベルホバー時*/
.modal-button:hover {
  color: #FFFFFF;
  background-color: #DDDDDD;
  box-shadow: 0 15px 30px -5px rgba(0,0,0,.15), 0 0 5px rgba(0,0,0,.1);
  transform: translateY(-4px);
}

.modal-wrapper:not(:target) {
  opacity: 0;
  visibility: hidden;
  transition: opacity .3s, visibility .3s;
}

.modal-wrapper:target {
  opacity: 1;
  visibility: visible;
  transition: opacity .4s, visibility .4s;
}

.modal-wrapper::after {
  display: inline-block;
  height: 100%;
  margin-left: -.05em;
  vertical-align: middle;
  content: ""
}

.modal-wrapper .modal-window {
  box-sizing: border-box;
  display: inline-block;
  z-index: 20;
  position: relative;
  width: 70%;
  max-width: 600px;
  padding: 10px 30px 25px;
  border-radius: 2px;
  background: #fff;
  box-shadow: 0 0 30px rgba(0, 0, 0, .6);
  vertical-align: middle
}

.modal-wrapper .modal-window .modal-content {
  max-height: 80vh;
  overflow-y: auto;
  text-align: left
}

.modal_title {
  font-size: 1.5em;
	position: relative;
	overflow: hidden;
  padding: 0;
}

.modal_title::before,
.modal_title::after{
	content: "";
	position: absolute;
	bottom: 0;
}

/* h2 プライマリカラー*/
.modal_title:before{
	border-bottom: 4px solid #6bb6ff;
	width: 100%;
}
/* h2 セカンダリカラー*/
.modal_title:after{
	border-bottom: 4px solid #c8e4ff;
	width: 100%;
}

.modal-content p {
  margin: 10px 0 0 0;
}

.modal-overlay {
  z-index: 10;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: rgba(0, 0, 0, .8)
}

.modal-wrapper .modal-close {
  z-index: 20;
  position: absolute;
  top: 5px;
  right: 5px;
  width: 35px;
  color: #95979c !important;
  font-size: 30px;
  font-weight: 700;
  line-height: 35px;
  text-align: center;
  text-decoration: none;
  text-indent: 0
}

.modal-wrapper .modal-close:hover {
  color: #2b2e38 !important
}
```

```room.js
const a = document.querySelector("#electric-cars");
// 次のようにしても動作します。
// const a = document.getElementById("electric-cars")

a.dataset.columns; 
a.dataset.indexNumber; 
a.dataset.parent;
```

### 試したこと
ループ文内に記入したりをしたのですが、クリック後に画面が真っ暗になるだけでモーダルが表示されませんでした。
ループ文の中にモーダル内容を入れるとクリックしたユーザーの情報を送れますか？

!追記!
#modal-01の01の箇所を{{ $myRoomMember->user->id }}や{{ $myRoomMember->id }}に変えたのですが、最後に取得したデータしかモーダルが開きませんでした。

### 補足情報（FW/ツールのバージョンなど）
PHP8
Laravel10


ループ文each内で複数userを表示され、クリックするとモーダルが開いてそのuserを削除出来たりする。

### 実現したいこと
Laravel Viteのnpm run devで、正しくcssが反映されるようにしたいです。
(現状、npm run publicd後だと正しくcssが反映されます) 

### 前提
現状、npm run publicd後だと正しくcssが反映されます。
しかし、npm run devでViteサーバを立ち上げたとたん、cssが反映されずコンソールに以下のようなエラーメッセージが出ます。
### 自作のページのエラー
```
tweet:10     GET http://0.0.0.0:5173/@vite/client net::ERR_ADDRESS_INVALID
tweet:10     GET http://0.0.0.0:5173/resources/css/app.css net::ERR_ADDRESS_INVALID
```

### ログインページのエラー
```
ailed to load resource: net::ERR_ADDRESS_INVALID     client:1
app.css:1     Failed to load resource: net::ERR_ADDRESS_INVALID
app.js:1     Failed to load resource: net::ERR_ADDRESS_INVALID
```

### 該当のソースコード
自作のページとログインページを例として取り上げます。

**自作のページ**
resources/views/tweet/index.blade.php
```php
<x-layout title="TOP | つぶやきアプリ">
    <x-layout.single>
        <h2 class="text-center text-blue-500 text-4xl font-bold mt-8 mb-8">
            つぶやきアプリ
        </h2>
        <x-tweet.form.post></x-tweet.form.post>
    </x-layout.single>
</x-layout>
```

resources/views/components/layout.blade.php
```php
<!doctype html>
<html lang="ja">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0,
          maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
   
    @vite('resources/css/app.css')
    <title>{{ $title ?? 'つぶやきアプリ' }}</title>
</head>
<body class="bg-gray-50">
    {{ $slot }}
</body>
</html>
```

**login画面**
```php
<x-guest-layout>
    
    <x-auth-session-status class="mb-4" :status="session('status')" />

    <form method="POST" action="{{ route('login') }}">
        @csrf

        
        <div>
            <x-input-label for="email" :value="__('Email')" />
            <x-text-input id="email" class="block mt-1 w-full" type="email" name="email" :value="old('email')" required autofocus autocomplete="username" />
            <x-input-error :messages="$errors->get('email')" class="mt-2" />
        </div>

        
        <div class="mt-4">
            <x-input-label for="password" :value="__('Password')" />

            <x-text-input id="password" class="block mt-1 w-full"
                            type="password"
                            name="password"
                            required autocomplete="current-password" />

            <x-input-error :messages="$errors->get('password')" class="mt-2" />
        </div>

        
        <div class="block mt-4">
            <label for="remember_me" class="inline-flex items-center">
                <input id="remember_me" type="checkbox" class="rounded dark:bg-gray-900 border-gray-300 dark:border-gray-700 text-indigo-600 shadow-sm focus:ring-indigo-500 dark:focus:ring-indigo-600 dark:focus:ring-offset-gray-800" name="remember">
                <span class="ml-2 text-sm text-gray-600 dark:text-gray-400">{{ __('Remember me') }}</span>
            </label>
        </div>

        <div class="flex items-center justify-end mt-4">
            @if (Route::has('password.request'))
                <a class="underline text-sm text-gray-600 dark:text-gray-400 hover:text-gray-900 dark:hover:text-gray-100 rounded-md focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500 dark:focus:ring-offset-gray-800" href="{{ route('password.request') }}">
                    {{ __('Forgot your password?') }}
                </a>
            @endif

            <x-primary-button class="ml-3">
                {{ __('Log in') }}
            </x-primary-button>
        </div>
    </form>
</x-guest-layout>
```
login画面のコンポーネントはどこにあるか不明

### 試したこと
https://qiita.com/konona5/items/21b9834064426f9046d8
ここに書いてある通りに
@vite('resources/css/app.css')→@vite('resources/sass/app.scss')
と書き換えてみましたが、結果は変わりませんでした。
※resources/sass/app.scssと_variables.scssができました

### 補足情報（FW/ツールのバージョンなど）
Laravel Framework 10.13.5
VITE v4.3.9

[Laravel] Viteのnpm run devでcssが適応されない

■背景
パスワードリセットの画面を実装したいと考え、bladeを使って実装しています。
①bladeテンプレート
まず、laravelのbladeを使いmaster.blade.php(views/layouts/index.blade.php)というテンプレートを作成しました。
このmaster.blade.phpの中に、以下のように画像を表示するタグを書いています

```HTML
<img class="logo" src="image/logo.jpg" alt="logo">
```

このmaster.blade.phpを、
・index.blade.php(views/index.blade.php)
・email.blade.php(views/auth/password/email.blade.php)
で読み込んでいます。

②image
画像ファイルは以下に格納しています
public/image/logo.jpg
(ルートディレクトリはpublicです)

③route
index.blade.phpを表示する際は、

```PHP
Route::get('/', 'HomeController@index');
```

email.blade.phpを表示する際は、

```PHP
Route::get('password/email', 'Auth\PasswordController@getEmail');
```

です。

■症状
index.blade.phpを表示する際はlogo.jpgがちゃんと表示されるのですが、email.blade.phpを表示する際はlogo.jpgがちゃんと表示されません。
それぞれ画像のURLを見てみると、以下のようになっています。
①index.blade.phpの場合・・/image/logo.jpg
②email.blade.phpの場合・・/password/image/logo.jpg 

画像が格納されているフォルダが/image/logoなので②の場合は表示されていないのだと思うのですが、これはどのように解消すればいいのでしょうか。
ちなみに、検索して{{HTML::image()}}を使う方法等が出てきたのですが、laravel5.2あたりからHTMLが削除されたみたいな話もあり、実際に{{HTML::image()}}を使おうとするとそんなクラスはないよ、と言われてしまいます。

どうかお知恵をお貸し頂けますと幸いです。

宜しくお願い致します。

Laravelのbladeで画像表示したいがページによって表示されたりされなかったりする

### 前提・実現したいこと

いつもお世話になっております。
Laravelのbladeでoldが取得できない原因を解決したいです。

### 発生している問題・エラーメッセージ

①入力フォームをbladeで用意しています。
入力フォームの構造です。
```
商品グループ1
 商品名（item_name）：テキストボックス
 追加ボタン
商品グループ2
 商品名（item_name）：テキストボックス
 追加ボタン

商品グループ1、商品グループ2のそれぞれindexを1、2と定義しておきます。
商品グループ1、商品グループ2には追加ボタンがあり、それぞれのグループに商品名のフォームを動的に追加できます。
```

②登録処理を行ってcontroller側でPOSTバリデーションを実施し、エラーとなり、フォームの入力画面に戻ってきた時にoldで入力フォームのテキストボックス内に入力値をセットしたいのですが、ここでエラーが発生します。
エラー: Undefined index: item_name


### 該当のソースコード

bladeのコードです。
```Laravel
/* 一つ目の商品名のフォームです。なので [0][item_name] / 0.item_name となっています。 */
/* 一つ目なので $index = 1 となります。
/* 追加ボタンが押され、二つ目の商品名のフォームになると [1][item_name] / 1.item_name となっていきます。 */
{{ 
  Form::text(
      "item_group[$index][0][item_name]",
      old('item_group.' . $index . '.0.item_name') ?? '',
      [
          'required',
          'class' => 'input-field'
      ]
  ), 'error_form')
}}
```

### old()でデバッグ

old()をbladeでdd()すると以下のようになっています。
```
"item_group" => array:1 [▼
    1 => array:1 [▼
      0 => array:1 [▼
        "item_name" => "商品名" // 例えば "チョコレート" とかが入ってきます。
      ]
    ]
]
```

### 試したこと

①該当のソースコードと同じで `old('item_group.' . $index . '.0.item_name')`
②別の方法で、 `old("item_group.$index.0.item_name")`

いずれも エラー `Undefined index: item_name` が出ます。

なお、bladeでdd()すると取得できています。

```Laravel
/* bladeでdd()するといずれの方法でも入力値をstringで取得できている */
@php dd(old('item_group.' . $index . '.0.item_name')); @endphp

@php dd(old("item_group.$index.0.item_name")); @endphp
```

Form内でやると失敗するのでしょうか。。。

### 補足情報（FW/ツールのバージョンなど）

Laravel 5.6
PHP 7.3

Laravelのbladeでoldの値がうまく取得できず困っています。

###前提・実現したいこと
Laravel5.2 + Vue.js

LaravelのControllerから値を添えたViewをReturnし、その値をVue.jsで取得する。

###該当のソースコード
全て例になります
```php
// Controller
~~~
public function index() : View
{
    // $items取得
    return View('index', [
        'items' => $items
    ]);
}
```
```html
// index.blade.php
~~~
<ul>
  <li v-for="item in list">
    @{{item}}
  </li>
</ul>
```
```javascript
// js(Vue.js)
Vue.component('hoge', {
  data() {
    return {
      list: []
    }
  }
}
```

###試したこと
Controllerの`index()`でデータを返すのではなく、ajaxで取得できるAPIをLaravel側で用意し、Vue.jsの`created`時にajax経由でAPIを叩いてデータを取得し、Vue.js内の`list`に追加するという方法はできています。
```JavaScript
// js(Vue.js)
Vue.component('hoge', {
  data() {
    return {
      list: []
    }
  },
  created() {
    this.fetchItems();
  },
  methods: {
    fetchItems() {
      this.$http.get('Laravel側で用意したAPI', items => {
        this.list = items;
      });
    }
  }
}
```

ですが、Controller経由でViewに渡されたデータをVue.jsで取得する方法があれば、教えていただきたいです。

また、Viewの中で`foreach($items as $item)`のようにしないのは、Vue.jsでデータの追加・削除をするためにVue.jsの変数`list`で持ちたいためです。

なにかアクションにフックして動くメソッドであれば`<button @click="get({{$items}})">`のようにして変数は渡せるのですが、今回は`created`時にはデータが欲しいためアクションに紐づくメソッドではなく、引数が受け取れません（もし引数を渡せる方法があるのでしたらおそらくそれが回答です！！！）

よろしくお願いいたします。

###補足情報(言語/FW/ツール等のバージョンなど)
PHP 7.0
Laravel 5.2
Vue.js 1.0.25

なにか不足などありましたらお申し付けください。

viewに含まれる変数をVue.jsの中で使いたい

Laravelのbladeのディレクティブの意味がわかりません。具体的には過去の処理の

  @if (Route::has('register'))
        
の部分です。
URLにregisterが含まれていたら表示、ということなのでしょうか？


```blade
           @if (Route::has('login'))
                <div class="top-right links">
                    @auth
                        <a href="{{ url('/home') }}">トップページ</a>
                    @else
                        <a href="{{ route('login') }}">ログイン</a>

                        @if (Route::has('register'))
                            <a href="{{ route('register') }}">新規登録</a>
                        @endif
                    @endauth
                </div>
            @endif
```

LaravelのbladeのRoute::hasについて

現在laravel5にて簡易webアプリケーションを作って勉強しています。

表題の内容について記述の仕方がわかりません。

dbからとってきた"sex"の値が1なら男、2なら女にcheckedを入れたいのです。

<label><input type="radio" value="1" name="sex">男性</label>
                                                            <label><input type="radio" value="2" name="sex">女性</label>

bladeでの記述の仕方がわからずググってもよくわかりませんでした。

どなたかご教授願います。

※追記

とりあえず下記のような

<label><input type="radio" value="1" name="sex" <?php if($user_info->sex == 1){ echo "checked";} ?>>男性</label>                                                
                                                            <label><input type="radio" value="2" name="sex" <?php if($user_info->sex == 2){ echo "checked";} ?>>女性</label>

のようにフツーにphpコード入れて対応してますが、blade(laravel5)的な記述があるなら教えて下さい。

laravel5 ラジオボタンのdbから取得した値による動的初期値

現在Laravelで簡単な掲示板アプリを作成しております。
エラーが出ているのですが解決策が分からず困っております。
ご教授お願いします。

#解決したいこと
**Are you sure the view exists and is a .blade.php file?**

こちらの表示が出てしまいビューが表示されないエラーを解決したいです。
![イメージ説明](2b2959282ff54c6c95dfef87794ce6d1.png)
![イメージ説明](78bfa2b73a2032ccfde79cd225d22d61.png)

resouces/views/index.blade.phpは表示されます。
![イメージ説明](94b4ac28e19ed878263e9da6b05dce81.png)
ここから投稿するを押すと上記のエラーが出ます。
create.blade.phpがうまく参照されていないのでは？と思いますが
controllerやroutesは問題ないように感じております。

##開発環境
MAMP 5.7
Laravel 7.19.1
 
### コード

**routes/web.php**
```php
<?php

use Illuminate\Support\Facades\Route;

/*
|--------------------------------------------------------------------------
| Web Routes
|--------------------------------------------------------------------------
|
| Here is where you can register web routes for your application. These
| routes are loaded by the RouteServiceProvider within a group which
| contains the "web" middleware group. Now create something great!
|
*/

Route::get('/', 'PagesController@index');
Route::view('/create', 'UsersController@create');
Route::post('/posts', 'UsersController@save');
Route::get('/users/{user}', 'PagesController@confirm');
Route::post('/delete', 'UsersController@delete' );
```
**Http/controllers/UsersController.php**
```php
<?php

namespace App\Http\Controllers;

use Illuminate\Http\Request;
use App\User;
use App\Http\Requests\UsersRequest;
use Illuminate\Support\Facades\Hash;

class UsersController extends Controller
{

    public function save(UsersRequest $request) { //登録処理
        $user = new User();
        if ($request->name) $user->name = $request->name;
        $user->password = Hash::make($request->password); //password_hashみたいなの
        $user->body = $request->body;
        $user->save();
        return redirect('/');
    }

    public function delete(Request $request) { //削除処理
        $user = User::findOrFail($request->id);
        if (Hash::check($request->password , $user->password)) { //password_verifyみたいなの
            User::destroy($user->id);
            return redirect('/');
        }
            $error = 'The password is incorrect';
            return view('confirm', ['error' => $error])->with('user', $user);
    }

    public function create() {
        $users = User::latest()->get();
        return view('create', ['users' => $users]);
    }
}
```
**Http/controllers/PagesController.php**
```php
<?php

namespace App\Http\Controllers;

use Illuminate\Http\Request;
use App\User;

class PagesController extends Controller
{

    public function index() {
        $users = User::latest()->get();
        return view('index', ['users' => $users]);
    }

    public function confirm(User $user) {
        return view('confirm', ['user' => $user]);
    }
}
```
**resouces/views/layouts/default.blade.php**
```php
<!DOCTYPE html>
<html lang="ja">
    <head>
        <meta charset="utf-8">
        <title>@yield('title')</title>
        <link rel="stylesheet" href="/css/styles.css">
    </head>
    <body>
        <div id="header">
            @yield('header')
            <h1>掲示板</h1>
        </div>
        <div id="main">
            @yield('content')
        </div>
    </body>
</html>
```
**resouces/views/index.blade.php**
```php
@extends('layouts.default')

@section('title', '掲示板')

@section('header')
    <p>現在の投稿<span>{{ $users->count() }}</span>件</p>
    <h2><a href="{{ url('/create') }}">投稿する</a></h2>
@endsection

@section('content')
    <dl>
    @forelse ($users as $user)
    <div class="posts">
        <dt>
            <span>1</span><span>名前：{{ $user->name }}</span>
            <span>{{ $user->created_at }}</span><br>
        </dt>
        <dd>
            {!! nl2br(e($user->body)) !!}
            <a href="{{ action('PagesController@confirm', $user->id) }}">削除</a>
        </dd>
    </div>
    @empty
        <p>まだ投稿はありません。</p>
    @endforelse
    </dl>
    @if ($users->count() > 5)
    <button id="load_more">全件表示</button>
    @endif
@endsection
```
**resouces/views/create.blade.php**
```php
@extends('layouts.default')

@section('title', '新規投稿')

@section('content')
    <form action="{{ url('/posts') }}" method="post">
    {{ csrf_field() }}
        <p>
            <input type="text" name="name" value="{{ old('name') }}" id="name" placeholder="enter name">
        </p>
        <p>
            <input type="password" name="password" placeholder="enter password">
        </p>
        @if ($errors->has('password'))
            <span class="error">{{ $errors->first('password') }}</span>
        @endif
        <p>
            <textarea name="body" rows="8" cols="40" value="{{ old('body') }}" placeholder="enter comment"></textarea>
        </p>
        @if ($errors->has('body'))
            <span class="error">{{ $errors->first('body') }}</span>
        @endif
        <p>
            <input type="submit" value="submit">
        </p>
    </form>
@endsection
```

よろしくお願いします。

Blade