[Vuejs]-Getting rest api data into bootstrap Vue table and pagination

by

0👍

In your template has two variables with same name:

<div v-for="(result, index) in result" :key="index">

try change the result name like this:

<div v-for="(item, index) in result" :key="index">
    <div class="media mb-4">
        <img
        :src="resizeArtworkUrl(item)"
        alt="Album Cover"
        class="album-cover align-self-start mr-3"
        >
        <div class="media-body">
        <h4 class="mt-0">

            <button
            type="button"
            class="btn btn-primary btn-lg mb-3 float-right"
            v-on:click="addItem(item)"
            :disabled="item.disableButton"
            >
            <font-awesome-icon icon="plus"/>
            </button>

            <b>{{item.collectionName}}</b>
        </h4>
        <h6 class="mt-0">{{item.artistName}}</h6>
        <p class="mt-0">{{item.primaryGenreName}}</p>
        </div>
    </div>
</div>

Leave a comment