Content of card does not render when state changed

[ErezBiren]

I did a simple example with TouchableOpacity that on press changes the count state from 1 to 2 and displays it as Text, but the new value is not rerendered.

https://codesandbox.io/s/runtime-forest-b5nqmc?file=/src/App.js

Any help would be much appreciated

import React, {useState} from 'react';
import {Text, View, TouchableOpacity} from 'react-native';
import Swiper from 'react-native-deck-swiper';

const App = () => {
  const [count,setCount] = useState(0);

  return (
    <Swiper
      cards={['a', 'b', 'c']}
      renderCard={() => {
        return (
          <View>
            <TouchableOpacity onPress={() => {
              setCount(2);
              console.log("Clicked");

            }} style={{ backgroundColor: 'yellow', width:60 }}>
            <Text>Increase</Text>
            </TouchableOpacity>

            <Text>{count}</Text>
           
          </View>);
      }}/>
            
  );
};

export default App;

[iyansr]

same issue

[YoussefHenna]

You can assign a ref to the DeckSwiper and call ref.forceUpdate() accordingly to get around this.