react-native-reanimated-carousel: Cannot add new property '__reanimatedHostObjectRef'

Faced with this issue in v3.1.1 This fix helps data={JSON.parse(JSON.stringify(data))}

It looks fine, I have released the official version, 2.3.3.

https://github.com/software-mansion/react-native-reanimated/issues/1517#issuecomment-1041810730

I made the repo

I will release the official version if the problem is fixed. @baronha @anhquan291 @KusStar @yairopro @braandl @Wuyialex @c0nsoleg

https://discord.gg/KsXRuDs43y

The issue happens like following:

When you assign data to the Carousel (in the data Props) and bind the exact same objects to another View. When you then send the Object to any native Component, the Carousel will produce this exact error.

When you create a deep-copy before sending it to the native Module, e.g. by using

const myCopy = Object.assign({}, originalObject);

it will not crash anymore.

So apparently the RN Module Bridge does (maybe freeze?) the Object and therefore ruins it for Reanimated2.

My conclusion is, that this is a Reanimated2 issue, since it should check the Object’s State and handle it properly, if the Object is e.g. frozen (or whatever it is, I did not dig into the bridge yet).

It seems that the reason is that the value we passed in was modified? We cut the association by “parser”. But how do we know what has been modified

I used a very bad solution but can fix this for now and wait for later releases:

data={JSON.parse(JSON.stringfy(data)}