Vue.js mixins call parent method in overridden implementation

Question

I'm using vuejs-datepicker component in a project however I need some custom behaviour that's why I decided to create my own datepicker and inject vuejs-datepicker as a mixin. The solution works fine but I'm looking for a way to call the parent method inside my overridden one. That's how my component looks for now:

  import Datepicker from 'vuejs-datepicker'

  export default {
    props: {
      /**
       * My custom property startDate to open a calendar on the given date by default
       */
      startDate: {
        validator: function (val) {
          return val === null || val instanceof Date || typeof val === 'string'
        },
        default: new Date()
      }
    },

    mixins: [ Datepicker ],

    methods: {
      /**
       * I override parent method setPageDate to read default startDate when none is specified
       */
      setPageDate (date) {
        // my code to set default date from the property
        if (!date) {
          date = this.startDate
        }

        // this part is the same as in the original method
        this.pageDate = new Date(date.getFullYear(), date.getMonth(), 1, date.getHours(), date.getMinutes()).getTime()
      }
    }
  }

Just one line of copied code isn't a big deal but I expect I need to override more methods in the future. So I'm looking for the best way to call that parent method inside my implementation, something like this.parent(date) or this.super(date). Is it possible at all?

Looks like there's a library for this: dev.to/ashraful/call-super-method-in-vue-component-3pl2 — diachedelic
– diachedelic, Commented Mar 10, 2020 at 23:14

Bert · Accepted Answer · 2017-08-12 19:45:36Z

24

There is no super or anything like that. You could do something like this:

  setPageDate (date) {
    // my code to set default date from the property
    if (!date) {
      date = this.startDate
    }

    Datepicker.methods.setPageDate.call(this, date)
  }

answered Aug 12, 2017 at 19:45

Bert

82.6k17 gold badges205 silver badges166 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

ConstantineUA Over a year ago

indeed, plain JS solution works fine there but I thought maybe Vue.js provides something else. Thank you!

Collectives™ on Stack Overflow

Vue.js mixins call parent method in overridden implementation

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related