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>