React-native-snap-carousel Pagination 관련

react-native-snap-carousel에서 Pagination을 불러올때
밑에 처럼 불러오는데 이걸 함수형 컴포넌트로 만들때 get pagination의 get을 뭐로 대체할수있나요?

import Carousel, { Pagination } from ‘react-native-snap-carousel’;

export default class MyCarousel extends Component {

_renderItem ({item, index}) {
    return <MySlideComponent data={item} />
}

get pagination () {
    const { entries, activeSlide } = this.state;
    return (
        <Pagination
          dotsLength={entries.length}
          activeDotIndex={activeSlide}
          containerStyle={{ backgroundColor: 'rgba(0, 0, 0, 0.75)' }}
          dotStyle={{
              width: 10,
              height: 10,
              borderRadius: 5,
              marginHorizontal: 8,
              backgroundColor: 'rgba(255, 255, 255, 0.92)'
          }}
          inactiveDotStyle={{
              // Define styles for inactive dots here
          }}
          inactiveDotOpacity={0.4}
          inactiveDotScale={0.6}
        />
    );
}

render () {
    return (
        <View>
            <Carousel
              data={this.state.entries}
              renderItem={this._renderItem}
              onSnapToItem={(index) => this.setState({ activeSlide: index }) }
            />
            { this.pagination }
        </View>
    );
}
...
const pagination = () => {
 ...
 return (<Pagination ... />)
}

return (
        <View>
            <Carousel
              data={this.state.entries}
              renderItem={this._renderItem}
              onSnapToItem={(index) => this.setState({ activeSlide: index }) }
            />
            { pagination }
        </View>
    );

대략 이렇게 하면 될 거 같네요.

함수호출이 아닌 방식으로 변수에 담아서 사용하시려면

const pagination = useMemo(() => {
    const { entries, activeSlide } = this.state;
    return (
        <Pagination
          dotsLength={entries.length}
          activeDotIndex={activeSlide}
          containerStyle={{ backgroundColor: 'rgba(0, 0, 0, 0.75)' }}
          dotStyle={{
              width: 10,
              height: 10,
              borderRadius: 5,
              marginHorizontal: 8,
              backgroundColor: 'rgba(255, 255, 255, 0.92)'
          }}
          inactiveDotStyle={{
              // Define styles for inactive dots here
          }}
          inactiveDotOpacity={0.4}
          inactiveDotScale={0.6}
        />
    );
},[this.state.entries, this.state.activeSlide])

혹은

const pagination = (() => { ... return <Pagination /> })();

형태로 사용하실 수 있습니다.