Is there a way to override some of npm's mixin which is called inside the component by the local one ?

I have an npm package component inside node_modules/somePackageName/components/footer.vue which use another of it's mixins from node_modules/somePackageName/mixins/popup.js

That popup.js contains following method:

methods: {
  setPopupActiveStatus (val, blur = true) {
    const isVisible = false
  }
},

And I want to override it's behaviour from App.vue where I use that footer.vue component with something like this:

methods: {
  setPopupActiveStatus (val, blur = true) {
    const isVisible = true
  }
},

But it doesn't work as I wanted to.

==== UPDATE ====

Here is the explanation of How I solved my issue based on @Estradiaz's answer:

enter image description here

When combining mixin & component options:

When a mixin and the component itself contain overlapping options, they will be "merged" using appropriate strategies:

  • Data objects undergo a recursive merge, with the component’s data taking priority in cases of conflicts.

  • Hook functions with the same name are merged into an array so that all of them will be called. Mixin hooks will be called before the component’s own hooks.

  • Methods, Components and Directives will be merged into the same object. The component’s options will take priority when there are conflicting keys in these objects.

Here's an example of a method provided by both a component and a mixin:

var mixin = {
  methods: {
    foo: function () {
      console.log('Mixin Msg')
    },
  }
}

var vm = new Vue({
  mixins: [mixin],
  methods: {
    foo: function () {
      console.log('Component Msg')
    },
  }
})

vm.foo() // => "Component Msg"

And here's an example in codesandbox

So I believe you should be able to "override" the mixin simply by providing a method with the same name on the component and it will take priority