在Laravel上使用vue js的单页Wordpress REST JSON API发布

时间:2018-09-24 03:42:09

标签: javascript php wordpress laravel vue.js

大家好,我想在laravel上使用带vue js的wp rest api显示带有wordpress帖子的单个页面。当我仅使用vue js而不使用laravel时,它运行平稳,我可以使用此代码获取帖子列表

export default {
created(){
    axios.get('http://localhost/newlara/main/public/wp/wp-json/wp/v2/posts?categories=7')
    .then(response => {
        //console.log(response);
        this.posts = response.data
    })
},
data(){
    return{
        posts: []
    }
},
 methods: {
    stripTags(html) {
        return sanitizeHtml(html, {
            allowedTags: []
        }).substring(0, html.indexOf('…'))
    }
}
};

但是现在我混淆了对单页代码的编码,我已经尝试过使用此代码,但是它不起作用,没有错误,但是它什么也没给我提供

var singlePost = Vue.extend({
 template: '#single-post-template',

 route:{
     data: function(){
         this.$http.get('/wp-json/wp/v2/posts/' + this.$route.params.postID, function(post){
             this.$set('post', post);
         })
     }
 }
});  
 var router = new VueRouter();

 router.map({
     '/':{
         component: postList
     },
     'post/:postID':{
         name:'post',
         component: singlePost
     }
 });

但是当我使用.vue中的这段代码在href上调用它时,它什么也没给我

<a v-link="{name:'post', params:{postID: post[0].id }}" class="btn-read-more">Read more</a>

当我仅在不使用laravel时使用vue js时,它运行得很好,我对此laravel感到困惑。我认为这是因为我使用了vue路由器,但在使用laravel路由时,我仍然会弄清楚如何使用它

0 个答案:

没有答案