Why is the vue-resize directive not working?

I have a component .vue file where I want to define the resize of an element and I am having trouble getting the vue-resize-directive connected correctly.

The item I am testing is a table footer, but I had the same result with div

. Here's the code from my template:

<tfoot><tr>
    <td :colspan="properties.length" v-resize="onResize"></td>
</tr></tfoot>

      

        
        
        
      

    

My script file includes:

var resize = require('vue-resize-directive');
module.exports = {
  directives: { resize },
  methods: {
    onResize: function() {
        console.log("resized");
    }
  }
}

      

        
        
        
      

    

The component compiles and displays correctly, including the element div.resize-sensor

that adds the directive, but resizing the table (or the entire window) does not result in console logging or warnings or errors.

Any ideas?