首页 > 解决方案 > 如何查询我的 WordPress 博客以列出我的 Vue.js 网站上的最新帖子?

问题描述

我正在尝试从我的网站获取我最近的帖子,但无法正确调用 API。我究竟做错了什么?

我正在使用 WordPress API 1.1 版和 Vue.js 2.0 版。我已经正确安装了 Axios 和所有必要的工具,包括 Vue.js Devtools 来查看正确 API 调用的结果。

但是,一旦我调用 API,它就不会列出任何帖子。

<template>
    <div>
        <div>
            <p>{{posts}}</p>
        </div>
    </div>
</template>

<script>
import Axios from "axios"

    export default {
        name: 'Blog',
        mounted() {
            this.getPosts();
        },
        data() {
            return {
                postsURL: "https://public-api.wordpress.com/rest/v1.1/sites/ninjawebsitedesign.com/blog/posts/?number=2&pretty=true",
                posts: [],
                postsData: {
                    per_page: 20,
                    page: 1
                }
            }
        },
        methods: {
            getPosts() {
                Axios.get(this.postsUrl, { params: this.postsData })
                    .then((response) => {
                        this.posts = response.data
                    })
                    .catch((error) => {
                        console.log(error)
                    })
            }
        }
    }
</script>

<style scoped>
    ul li {
        color: black !important;
    }
</style>

标签: javascriptnode.jsvue.js

解决方案


您需要在 wordpress 上启用 REST API 并使用此 url api:https ://ninjawebsitedesign.com/wp-json/posts


推荐阅读