Make own Vue components available on all pages

[ryanmstokes]

In the documentation of framework7+vue it is clear how to create your own reusable components but I cant find any documentation on this for app-framework? you only seem to describe how to create and register pages. How do I create a component that I can reuse in templates. For instance If i make my own button template - where do I create this file and how do I register the button so that it is available globally in templates e.g. <my-custom-button></my-custom-button>

[scriptPilot]

Thanks for that proposition - is possible by extending the root vue object, I will add documentation soon. https://github.com/scriptPilot/app-framework/blob/master/docs/extend-vue-root-object.md

[cyberstories]

thanks for your quick response!

[cyberstories]

So I can get it to work if i create the component within the vue file like so:

module.exports = (vue) => {
vue.component('custom-toolbar', {
template: <f7-toolbar tabbar labels> <f7-link icon="icon-home" text="icon-home" tab-link="#tab1"></f7-link> <f7-link icon="icon-pie-chart" text="Tab 2" tab-link="#tab2"></f7-link> <f7-link icon="icon-show_chart" text="icon-home" tab-link="#tab1"></f7-link> <f7-link icon="icon-list" text="Tab 2" tab-link="#tab2"></f7-link> </f7-toolbar>
});
return vue;
}

but I want to create a single file component with its own style tag, e.g. custom-toolbar.vue can you please explain briefly how to do this after extending the root vue object?

[scriptPilot]

Here you are: https://github.com/scriptPilot/app-framework/blob/master/docs/extend-vue-root-object.md

[cyberstories]

Thank you for such a fast reply - thats great :)

[cyberstories]

Hey just to let you know the documentation is great but you made a little mistake that might confuse people:

<template>
  <f7-page>
   <f7-block>

     <!-- what your wrote! (incorrect) -->
     <customButton />

     <!-- correct -->
     <custom-button />

   </f7-block>
 </f7-page>
</template>

Thanks again for writing that documentation so quickly!