How to stop Ember mouse event handlers from getting lagged

So I have a component that I am handling mouseEnter and mouseLeave events for, so that the component can slide down and up as the mouse enters and leave it.

I have done this in jQuery many times before without Ember and I don't remember this ever happening. Basically what happens is, it will execute every mouseEnter and mouseLeave event (stacking them on top of each other) so if a user accidentally mouses into the component and the mouse leaves and then goes back into it, it will slide down, then slide up, then slide down again. If I rapidly enter and exit it will slide down, up, down, up, down, up. as many times as I did it.

Couldn't find anything about this as it seems it's hard to find anything about obscure uses of Ember.

This is what I have in the component's JS file:

import Ember from 'ember';

export default Ember.Component.extend({
  classNames: ['template-select', 'windows-select-container'],

  mouseEnter: function() {
    let $options = $('.windows-select-container > .vault-custom-container')
    $options.slideDown();
  },

  mouseLeave: function() {
    let $options = $('.windows-select-container > .vault-custom-container')
    $options.slideUp();
  }
});