Getting error "enimEvt is not a function" when I close the modal by swiping down in react-native 0.63.2.

[kishanbharda]

I am using this component in my project. My react-native version is 0.63.2. Here the code that I have used to display modal :

// First I imported modal box 
import ModalBox from 'react-native-modalbox';

// created a ref to hold the modal
const changePasswordModal = useRef();

// Opening modal by clicking on one of my list item 
<ListItem
  accessoryLeft={(liArProps) => (
    <Icon {...liArProps} name="lock-outline" />
  )}
  accessoryRight={(liArProps) => (
    <Icon {...liArProps} name="chevron-right-outline" />
  )}
  title="Change Password"
  onPress={() => changePasswordModal.current.open()}
/>

// code that I used to define modal
<ModalBox
  ref={changePasswordModal}
  backButtonClose={true}
  style={styles.changePasswordModal}>
  <ChangePassword />
</ModalBox>

// modal style
changePasswordModal: {
  height: Dimensions.get('window').height / 2,
  width: Dimensions.get('window').width - 50,
},

But now, when I open a modal and close it by swiping down it crash the app and displaying me an error :

This is only happing if I close modal by swiping down, If I close modal by clicking on backdrop it's closing properly without any error.

[R1D3]

same issue for me, it only happens since this morning ....

[winardis]

i just updated to react native 0.63.3 and having the same issue as you are

[januarsmad]

set useNativeDriver to false. it works on me..

[iabduul7]

set useNativeDriver to false. it works on me..

where to put this line?

[uzaircs]

Same issue

TypeError: animEvt is not a function

Setting useNativeDriver={false} does work but causes opening animation to disappear. The modal just appears without any animation after a slight delay.

I have set swipeToClose={false} for now until I see a better solution for this.

Edit : A better workaround for now is setuseNativeDriver : false in createPanResponder (This doesn't effects the default opening and closing animations and swipeToClose works as well)

From const animEvt = Animated.event([null, {customY: position}], {useNativeDriver: this.props.useNativeDriver});

to

const animEvt = Animated.event([null, {customY: position}], {useNativeDriver: false});

in index.js

Maybe someone can come up with an explanation for this. Not sure why this happens

[uzaircs]

set useNativeDriver to false. it works on me..

where to put this line?

In the Modal Component

   <Modal
          useNativeDriver={false}
          ref={"modal1"}
          //other props
    >
   </Modal>

Or see this answer

[iabduul7]

set useNativeDriver to false. it works on me..

where to put this line?

In the Modal Component

   <Modal
          useNativeDriver={false}
          ref={"modal1"}
          //other props
    >
   </Modal>

Or see this answer

Okay, got it

[maxs15]

Fixed in version 2.0.2 👍