WordPress simple load more posts using Vue and WP Rest API

Загружайте больше сообщений, используя Vue.js и WP Rest API

Что нового?

• Теперь использует Vue 3@latest (CDN).
• Никакого сервера или этапа сборки не требуется, просто запустите index.html в своем браузере!

Мы рассмотрим минималистичный пример на основе компонентов Vue, который будет получать сообщения с помощью WordPress Rest API.

Не правда ли, было бы здорово использовать что-то подобное в вашей разметке?

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

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

С возможностью вывода любой желаемой разметки в формате html при компиляции для ваших стилевых нужд. Поэтому в следующий раз, когда вам понадобится увеличить нагрузку на свои веб-сайты, ваша HTML-разметка останется прежней.

Или, возможно, попробуйте что-то вроде кода ниже для другого типа сообщений.

  <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>