[Vuejs]-Import vue component and extend template

by

4👍

✅

The .vue files export components definition only, so you are able to do something like this:

import Foo from 'Foo'

var Bar = {

    // inherit everything from Foo
    mixins: [Foo], 

    // rewrite the template
    template: `<div>` + Foo.template + `</div>`
}

export default Bar

Keep in mind that Foo is just an object, it is just the definition of the component like the one you export in your own components, so you may feel free to use all it’s options, but if you modify them you affect their usage in whole project. Think twice when doing things like: 

Foo.template = `<div>${Foo.template}</div>`
👤Slim

Leave a comment