2017-02-19 9 views
0

これはかなり複雑な構造です。 Q & AのためのサイトのようなStackOverflowのを想像:私はコンポーネントQuestionAnswerCommentに認証されたユーザーを渡したいVue.js 2.0はAuth :: user()を複雑な階層の子コンポーネントに渡します

app.js    //new Vue object <- receives Auth::user() object by AJAX 

- Question.vue  //main component 
-- AnswerList.vue // a question has an answer-list 
--- Answer.vue  // an answer-list has multiple answers 
---- CommentList.vue // an answer has a comment-list 
----- Comment.vue // a comment-list has multiple comments 

。しかし、からAnswerListCommentListです。

私は本当に階層内のすべてのコンポーネントにpropsとしてauthuserオブジェクトを追加する必要がないだけで、これらのコンポーネントへAuth::userまたは を渡す方法はありますか?

答えて

2

authUserとしてAuth::user()がルートインスタンスに格納されている場合、子コンポーネントで最も簡単にアクセスするには、this.$root.authUserを使用します。

このようにして、ルートインスタンスを効果的にストアとして使用できます。

希望すると便利です。

+0

美しいです。さて、私はデータがコンポーネント間でどのように共有されているのか理解しています! –

2

答えが受け入れられ、OPが満足のいく解決策を見つけたとしても、Vuexを使用することが重要です。これは、コンポーネント間で共有できるデータを保持する集中データストアです。また、構造化されたデバッグ可能な方法で、すべてのコンポーネントのvuexストアのデータを修正することができます。これは受け入れられたソリューションでは不可能です。

私は、OPのニーズには過剰なものかもしれないが、私はまだそれが良い解決策であると信じています。

関連する問題