search

mauricius / vue-draggable-resizable

Vue3 Component for draggable and resizable elements.
https://mauricius.github.io/vue-draggable-resizable/
MIT License
3.34k stars 560 forks source link

How to constrain right and bottom #285

Closed whatoeat2night closed 3 years ago

whatoeat2night commented 3 years ago

I used a component like this:

`<vue-draggable-resizable ref="draggable" :max-width="250" :min-width="200" h="auto" :z="10" :x="x" :y="y" :parent="true" :resizable="false" class-name-draggable="draggable-container" @dragging="onDrag" @resizing="onResize"

`

the drag function: onDrag: function (x, y) { this.$refs.draggable.left = Math.max(10, x) this.$refs.draggable.right = Math.min(100, x) this.$refs.draggable.top = Math.max(10, y) this.$refs.draggable.bottom = Math.max(500, y) const bottom = this.$refs.draggable.bottom const left = this.$refs.draggable.left },

The problem is that: I cannot constrain right and bottom to have a margin with the parent, such as margin-right 10px or margin-bottom 200px

whatoeat2night commented 3 years ago

left and top works for me

whatoeat2night commented 3 years ago

Solved, please close