WordPress simple load more posts using Vue and WP Rest API

Carregue mais postagens usando Vue.js e WP Rest API

O que há de novo?

• Agora usa Vue 3@latest (CDN)
• Não é necessário nenhum servidor ou etapa de construção, basta executar index.html em seu navegador!

Veremos um exemplo minimalista baseado em componente Vue que buscará postagens usando a API Rest do WordPress.

Não seria legal usar algo assim na sua marcação?

  <posts>
    <post
      class="post"
      :id="post.id"
      :title="post.title.rendered"
      :permalink="post.link">
    </post>
  </posts>

  <button @click="getPosts(page)">Load Posts</button>

Com a capacidade de gerar qualquer marcação desejada em HTML na compilação para suas necessidades de estilo. Portanto, da próxima vez que você precisar carregar mais seus sites, sua marcação HTML permanecerá a mesma.

Ou talvez tente algo como o código abaixo para outro tipo de postagem.

  <movies>
    <movie
      class="movie"
      :id="movie.id"
      :title="movie.title.rendered"
      :permalink="movie.link"
      :genre="movie.genre"
      :duration="movie.duration
      :rating="movie.rating">
    </movie>
  </movies>