Vue Unknown Custom Component

Posted 3 years ago by infernobass7

I am fairly new with vue and I am trying to build a component that references another component. I have managed to do this successfully with a different file but I can't get this one to work.

Here is the main component: (some pieces have been removed)

    <div class="col-sm-3">

        <div class="list-group" id="exp-categories">
            <category v-for="category in categories" :category="category" :exp_cat_active.sync="exp_cat_active"></category>

    <div class="col-sm-9 items">

        <div class="col-xs-6 col-md-4" v-for="expendable in items">
            <expendable :expendable="expendable"></expendable>
        <pages :count="expendables.length" :per-page="30" uri="/api/expendables"></pages>

    import pages from './partials/pagination.vue'
    import category from './partials/Category.vue'
    import expendable from './partials/Expendable.vue'
    export default {

        data() {},

        created() {},

        computed: { },

        methods: {  },

            'other-component': pages, category, expendable

Here is the sub component:

    <ul class="pagination">
        <li v-for="n in length">
            <a href="#" @click="updateExp">{{ n }}</a>

    export default {

        props: ['count', 'perPage', 'uri'],

            length: function() {
                return Math.ceil(count/perPage);

            updateExp: function() {
                this.activePage = n;

I keep getting the following error when I load the page:

[Vue warn]: Unknown custom element: <pages> - did you register the component correctly? For recursive components, make sure to provide the "name" option.
main.js:2915Error: Warning Stack Trace
    at warn (main.js:2915)
    at checkComponentAttr (main.js:3413)
    at checkComponent (main.js:8849)
    at compileElement (main.js:8641)
    at compileNode (main.js:8602)
    at compileNodeList (main.js:8784)
    at compileNodeList (main.js:8785)
    at compile (main.js:8381)
    at VueComponent.Vue._compile (main.js:10023)
    at VueComponent.Vue.$mount (main.js:11021)

Please sign in or create an account to participate in this conversation.

Reply to

Use Markdown with GitHub-flavored code blocks.