Nara Laravelモデル値を小道具として渡すときにVue投げエラーが発生する

Question

オブジェクトを小道具として呼び出そうとしています。 Auth::user()->carは私の車モデルですが、nullでもかまいません。

さて、VUEに、私は私のコンポーネントに渡ししようとしています：Carオブジェクトが存在する

<my-comp :car="{{ Auth::user()->car }}"> </my-comp> 

場合、それは動作します。このアプローチは機能していないと私は間違って何をやっている理由しかし、それがnullの場合、VUEは

[Vue warn]: Failed to generate render function:

SyntaxError: Unexpected token } in

エラーがスローされます私はreturn view()->with(..を使用して$carを返すことができます知っている、しかし、私は好奇心旺盛です。

---

私が試した他の方法：

<my-comp :car="{{ Auth::user()->car ? Auth::user()->car : null }}"> </my-comp> 

<my-comp car="{{ Auth::user()->car }}"> </my-comp> 

Answer 1

は、あなたが車プロパティに全体Carオブジェクトを通過したいですか？それとも車の名前なのでしょうか？

あなたが名前をしたい場合、それは文字列であるよりも、私は下記のようなもののためにあなたが「添付する必要があります。

<my-comp :car="'{{ Auth::user()->car ? Auth::user()->car : null }}'"> </my-comp> 

、それはあなたがVueののマウント（）メソッドでメソッドを呼び出す必要がありますよりも、オブジェクトの場合をAxiosを使用してCarオブジェクトを取得します。

Answer 2

空の文字列を使用すると、テンプレートのコンパイルが失敗します。

<my-comp :car=""></my-comp>で空の文字列を設定していません。

正しい方法は<my-comp :car="''"></my-comp>です。

v-bindは、javascript式が必要です。

ので、あなたが試みることができる：

<my-comp :car="{{ Auth::user()->car ? Auth::user()->car : 'null' }}"> </my-comp> 

をして、あなたはVUE