LaravelからVueへの値の受け渡しの際にちょっと躓いたことが有ったのでメモ。
・blade内にコンポーネントタグを挿入する場合の例です。
・Vue側には受け渡したいプロパティが定義されている前提です。
環境
Laravel：6～9くらいまでなら基本同じだと思います。
vue：2
文字列以外の受け渡しには@jsonを使っておく
例えば真偽値を渡したいときに
<component :example="{{ 1 + 1 === 2}}"></component>
としてもtrueは渡せません。
<component :example="@Json(1 + 1 === 1)"></component>
上記のように@jsonを使えばtrueが渡せます。
下記サイト様は詳しく説明してくださってます。
@jsonを使うなら {{ }} は、いらない
当然ですが@jsonは@ifなどと同じディレクティブなので、 {{ }}で囲む必要はありません。
コロンの有無は、静的か動的かの違い。
これはVueの仕様の話ですが一応。
例えば、
<component :example="hello"></component>
とした場合、エラーになります。
helloは静的な値なので、exampleの前のコロンを取って
<component example="hello"></component>
としてやればOKです。
ちなみに、当然と言えば当然ですが
<component :example="{{$something}}"></component>
上記のような形でLaravel（php）側の変数を入れる場合、
Laravel側から見れば$somethingは動的な値ですが、
vue側から見れば静的な値なので、この場合もコロンは要りません。
<component example="{{$something}}"></component>
としてやればOKです。
Vue公式