Async and await in Vuejs
Vue can't resolve promises in properties so you have to do something like this.
Template
<div v-for="post of posts"> ... <img :src="post.profilePicture" /> ...
JavaScript
export default { created() { this.posts = ... await Promise.all(this.posts.map(async post => { post.profilePicture = await this.getUserPicturePath(post.name); })); }}
you can maybe go with
<template> ... <img :src="img_path" v-if="img_path"> ...</template><script> ... data() { ... img_path: "", img: "userImg.png" } // or however you wish to pass user image and trigger loading create() { this.getUserPicturePath(this.img) }, methods: { getUserPicturePath(name){ axios.get('getImage/'+name) .then(response => { this.img_path = response.data.path console.dir(response.data.path) }) .catch(error =>{ // ... error }) }, }