More than 3 years have passed since last update.

vue3 vue.blade から子 vueにデータを送る

Posted at 2022-06-04

vue.blade.php のヘッダに検索ボタンを付ける。
等という事案で使える。

親の変数を子要素でwatchして、子要素の処理をする。
といった流れ。

vue.blade.php

.js

<div @click="$root.searchFormVisible = true">検索ボタン</div>

色々略

    data () {
        return {
            searchBtnVisible:false,
            searchFormVisible:false,
        }
    },

これを子要素で察知したい。

watch: {
    //移動する度に動作させる
    //親メソッドの変更を察知する
    '$root.searchFormVisible'(data) {
        console.log(data);
    },
},

これで