Vue.jsでbackground-imageを指定する
APIで取得してきたものをhtml内でなんとか指定したいっていう感じ
諦めてimgタグでレイアウト整えようとしたところで解決したので、感動した。
vueなどで普段から書いているフロントエンドエンジニアたちにとってこの書き方ができるかできないかで生涯年収が2倍違うと言っても過言。
index.vue
<template><div:style="{backgroundImage: 'url(' + img[img.length-1].img_url + ')'}">
HelloWorld!
</div></template><script>exportdefault{asyncasyncData(){returnawaitaxios.get('/api/img/get_img').then(res=>{return{img:res.data.details.img}}).catch(error=>{// throw error;});},}</script>