David-Desmaisons/Vue.resize

TypeError: Cannot set property 'detach' of undefined

Itee opened this issue · 0 comments

Itee commented

Hi,

i got some trouble using this package.

I use this code snippet:

import Vue from '../../../../node_modules/vue/dist/vue.esm'
import resize from 'vue-resize-directive'

export default Vue.component( 'MyResizableComponent', {
    template: `
        <div v-resize="onResize"></div>
    `,
    directives: {
        resize
    },
    methods:  {

        onResize ( event ) {

            const domElement = this.$el
            console.log(`client(w/h): ${domElement.clientWidth}/${domElement.clientHeight}`)
            console.log(`offset(w/h): ${domElement.offsetWidth}/${domElement.offsetHeight}`)
            console.log(`event: ${event}`)

        }

    }

} )

and i got this errors:

[Vue warn]: Error in directive resize inserted hook: "TypeError: Cannot set property 'detach' of undefined"

and

Cannot set property 'detach' of undefined at ResizeSensor

Apparently the this argument is not correctly bound here:

/**
           * Class for dimension change detection.
           *
           * @param {Element|Element[]|Elements|jQuery} element
           * @param {Function} callback
           *
           * @constructor
           */
          var ResizeSensor = function ResizeSensor(element, callback) {
              
              //...

              this.detach = function (ev) {
                  ResizeSensor.detach(element, ev);
              };
          };