DBの値をVueで扱いたい
<ul v-for=items> <li></li> </ul>
こんな風にfor文とかでVueを使って値を回したい。
でも、Vueからデータベースの値を取ることはできない。
ということで、Laravelなどバックエンドから値をとってきて、Vueに渡してやる必要がある。
ではどうやるのがいいか。
今の所、2つを組み合わせれば良さそうφ(･･
1. APIで呼び出す
SPAやドキュメントでよくある、APIでデータを取得する形式。
Laravel側はAPIを提供し、Vue側で呼び出す。そうすれば、レスポンスで得られた情報をそのまま扱えばいい。
Vueのチュートリアルとかでもよくあるやり方ですねφ(･･
2. テンプレートエンジン(blade)で値を文字列で渡す
Bladeに値を埋め込む形式。
例えば、Vueのdataのところに、値を埋め込む。
data:
items: {{ json_encode($items) }}
これで、itemsにjson形式で値が渡せます。
普通はAPI形式で良いのですが、ログインが影響するものや、コンフィグなど、
APIを使えない・使うほどではない時には、こちらの力技をやるのが良さそう
組み合わせて使い分けよう
MPAだと、2番目の案が使えます。
向き不向きがあるので、使い分けましょうφ(･･
他にも値を渡すだけならやり方がありますので、自分の今やっていることに一番適していると思われるのを選びましょうφ(･･
