未知的自定义元素:您是否正确注册了组件? Vue js Laravel

时间:2020-05-23 10:51:52

标签: javascript laravel vue.js vue-component

我遇到那个错误:未知的自定义元素:-您是否正确注册了组件? 我想通过Vue.js喜欢系统。 我该如何解决?请帮忙。 看来我正确地编写了所有内容... 我几乎没有使用Vue.js之类的工具的经验,所以我不太了解哪里出了问题

web.php

Route::post('/blog/like','BlogController@getlike');
Route::post('/blog/like/{id}','BlogController@like');

BlogController

public function getlike(Request $request)
{
    $article = Article::find($request->article);
    return response()->json([
        'article'=>$article,
    ]);
}


  public function like(Request $request)
{
    $article = Article::find($request->article);
    $value = $article->like;
    $article->like = $value+1;
    $article->save();
    return response()->json([
        'message'=>'Thanks',
    ]);
}

LikeComponent.vue

<template>
    <div class="container">
        <p id="success"></p>
       <a href="http://"><i @click.prevent="likePost" class="fa fa-thumbs-up" aria-hidden="true"></i>({{ totallike }})</a>
    </div>
</template>
    <script>
        export default {
            props:['article'],
            data(){
                return {
                    totallike:'',
                }
            },
            methods:{
                likePost(){
                    axios.post('/blog/like/'+this.article,{article:this.article})
                    .then(response =>{
                        this.getlike()
                        $('#success').html(response.data.message)
                    })
                    .catch()
                },
                getlike(){
                    axios.post('/blog/like',{article:this.article})
                    .then(response =>{
                        console.log(response.data.article.like)
                        this.totallike = response.data.article.like
                    })
                }
            },
            mounted() {
                this.getlike()
            }
        }
    </script> 

app.js

require('./bootstrap');

window.Vue = require('vue');

Vue.component('like-component', require('./components/LikeComponent.vue').default);
const app = new Vue({
    el: '#app',
});

article.blade.php

 <like-component :post="{{ $article->id }}"></like-component>

1 个答案:

答案 0 :(得分:0)

我认为您必须定义子组件 在具有ID应用程序的代码中

article.blade.php

像这样:

id}}”>

,您必须跑步 npm在控制台中运行监视

相关问题