Не могу вывести изображение из api DRF
Я получаю вот такой массив
{title: "Посредственность из школы магов 2", year: "2022-02-15", type: "Special", poster: "
localhost:8000/media/anime_poster/magi.jpg"}
<script>
import axios from 'axios'
export default {
name: 'Index',
data() {
return {
anime: [],
};
},
mounted() {
axios
.get('http://localhost:8000/api/anime/all')
.then(response => (this.anime = response.data));
},
};
</script>
Вывожу данные циклом
<div v-for="anim in anime">
<p>{{ anim.title }}</p>
<p>{{ anim.year }}</p>
<p>{{ anim.type }}</p>
<img src={{ anime.poster }}>
</div>
Все данные выводятся кроме изображения, если перейти по ссылке изображения то там будет Page not found(404)
Что нужно сделать чтобы по этой ссылке было изображение, или это можно решить другим способом?