v-movable icon indicating copy to clipboard operation
v-movable copied to clipboard

v-movable parameters appear to not be reactive in Nuxt

Open thely opened this issue 3 years ago • 0 comments

I'm running this inside Nuxt v2.15.3. I'd like to be able to dynamically set the bounds limits of movable on mounted() once I can get the size of the contents inside it, but at least when testing this with xLimit below (default of 500), the limit doesn't appear to change. Similarly, I'd like to have disabled be dynamic, but that's not working, either. The element is still draggable if disabled is set to true after creation. Using the Vue inspector, it seems like altering disabled after the fact actually creates a new instance of movable, but doesn't do anything with the old one.

What's the deal here? Is this component intentionally non-reactive?

<div ref="parentEl" class="image-frame">
    <movable
      class="top-bar"
      target="parentEl"
      :bounds="{ x: [0, xLimit], y: [0, 500] }"
      :disabled="disabled"
      @move="$emit('move', $event)"
      @complete="$emit('drop', $event)"
    >
        ... contents ...
    </movable>
</div>

thely avatar Aug 18 '21 22:08 thely