Controlled Position not working

[CubE135]

Describe the bug As i am trying to control the position of a draggable element, it does not seem to work properly. I tried everything i could imagine, read through the source code of the example etc. but i can not get it to work.

To Reproduce Steps to reproduce the behavior:

1. Use this code: (Also not working without any style or classes)
2. Run it
3. Click on the "I can be clicked" box.
4. Watch as nothing will happen.

Expected behavior When clicking the "I can be clicked" box, the "I can be dragged" Box should change its position.

Screenshots

Desktop (please complete the following information):

• OS: Windows 10
• Browser Chrome
• Version 105.0.5195.127

Additional context Im using nuxt, this is my draggable plugin:

[bcakmakoglu]

Sorry I am a little busy right now but I will get back to you as soon as I can :)

Just to make sure: You're using Vue2 right?

[CubE135]

Yes, i am :)

[bcakmakoglu]

Sorry for the very late update, I have been super busy with different projects but I will take a look into this problem now 👍

[bcakmakoglu]

I can't seem to properly reproduce this issue, could you provide me with a sandbox for this? @CubE135

[CubE135]

I can't seem to properly reproduce this issue, could you provide me with a sandbox for this? @CubE135

Sure, here you go: https://codesandbox.io/p/sandbox/draggable-c3jxkw

[bcakmakoglu]

Alright so after a lot of debugging and having forgotten this issue: Can you try replacing the controlledPosition object completely instead of mutating it's x and y value?

So instead of this

controlledPosition.x = 100

Do this

controlledPosition = { ...controlledPosition, x: 100 }

Then it should work as expected 😅

[CubE135]

Hey :) As time has gone by, i was able to find a different solution for my problem. But anyways, im glad to hear that you got the issue resolved :)