How to pass props to mixin?

Question

Vue.js

I'm using webpack and single file components, I want to extend a component from a plugin. I do it like this:

import BImgLaze from 'bootstrap-vue/src/components/image/img-lazy'
  export default {
    name: "b-img-lazy-ex",
    extend: BImgLaze,
  }

I am using the component:

<b-img-lazy-ex :src="require('./assets/img/' + img.filename)" center fluid blank-color="#000"/>

The problem is that src and other attributes are not being passed to the component I extended from.

Answer 1

If you need to use a mixin, then try this :

import BImgLaze from 'bootstrap-vue/src/components/image/img-lazy'
export default {
  name: "b-img-lazy-ex",
  mixins: [BImgLaze],
}

If you just want to extend the component to others, then you need to use extends , not extend .

Answer 2

Props are not properly inherited from mixins / extended components

export default {
  extends: parent,
  props: {...parent.props}
}