updated: 2022/2/18
より良い方法：
blade template 内の vue component にデータをパスしたい場合
例えば
authHome.blade.php / guestHome.blade.php
の二つに共通で PageBody.vue という vue component を使うとき、Laravel 側で Auth::checkして得た情報を PageBody にパスしたい場合
router 側でAuth::check の結果で表示する view を切り替える。
@authHome.blade.php / guestHome.blade.php
@extends('layouts.app')
@section('content')
<div id="app">
<pageBody></pageBody>
</div>
@endsection
blade template から直接 vue component にデータをパスすることはできないのでブラウザのセッションストレージを使う。
@authHome.blade.php
@extends('layouts.app')
@section('content')
<div id="app">
<pageBody></pageBody>
</div>
<script>
sessionStorage.clear();
sessionStorage.setItem("guest", "false");
</script>
@endsection
@guestHome.blade.php
@extends('layouts.app')
@section('content')
<div id="app">
<pageBody></pageBody>
</div>
<script>
sessionStorage.clear();
sessionStorage.setItem("guest", "true");
</script>
@endsection
@PageBody.vue
<script>
export default {
data() {
return {
auth: ""
}
},
beforeMount() {
this.auth = sessionStorage.getItem("guest");
}
これで vue component 側に auth 情報がパスできたので 例えば v-if 等で login logout register 等の header を切り替えることが出来るようになる。
