如何使用第三方组件

时间:2019-04-11 07:16:37

标签: laravel vuejs2

我有一个简单的任务组件,工作正常,想添加分页功能,因此在添加以下行

Vue.component('pagination',require('laravel-vue-pagination'));

未捕获的ReferenceError:未定义Vue

即使在我的app.js中,vue也是如此被导入

window.Vue = require('vue');

我的任务组件js代码

Vue.component('pagination', require('laravel-vue-pagination'));
    export default {
        data() {
            return {
                tasks: {},
            }
        },
        methods: {
            // Our method to GET results from a Laravel endpoint
//            getResults(page = 1) {
//                axios.get('http://laravel.vue.com/tasks?page=' + page)
//                    .then((response) => this.tasks = response.data)
//                    .catch((error) => console.log(error));
//            }
        },
        mounted() {
            console.log('Component Mounted.')
        },
        created() {
            console.log('Tasks Component Loaded.');
            //console.log(this.tasks);
            axios.get('http://laravel.vue.com/tasks')
            .then((response) => this.tasks = response.data)
//                .then((response) => console.log(response.data))
                .catch((error) => console.log(error));
        },
    }

1 个答案:

答案 0 :(得分:1)

我不确定,但是请尝试以下操作: 在app.js中:

Vue.component('pagination', require('laravel-vue-pagination'));

在您的任务组件js代码中:

<pagination></pagination>