Failed to show image in nuxt frontend with strapi

hi everyone i am unable to show image in frontend nuxt
can anyone pls help me out from this


here is my query code

export const allArticlesQuery = gql`
  query allArticlesQuery {
    articles {
      data {
        id
        attributes {
          title
          date
          description
          slug
          body
          image {
            data {
              attributes {
                url
              }
            }
          }
        }
      }
    }
  }
`;

here is my index code

<div class="">
      <div>
        <div v-for="article in articles.data" v-bind:key="article.id">
          <div>
            <NuxtLink
              :to="{ path: article.attributes.slug, query: { id: article.id } }"
            >
              <h3>
                {{ article.attributes.title }}
                <span>{{ article.attributes.date }}</span>
              </h3>
            </NuxtLink>
            <p>{{ article.attributes.description }}</p>
            <img :src="article.attributes.image.data.attributes.url" />
          </div>
        </div>
      </div>
    </div>