Поместите LottieView в свои собственные страницы

Question

import React, { Component } from 'react';
import { View } from 'react-native';
import { Pages } from 'react-native-pages';
import LottieView from 'lottie-react-native';

class Animation extends Component {
    componentDidMount() {
        this.animation.play();
    }

    render() {
        return (
            <Pages>
                <View>
                    <LottieView
                        style={{ height: 400, width: 400 }}
                        ref={animation => {
                            this.animation = animation;
                        }}
                        source={require('../first.json')}
                    />
                </View>
            </Pages>
        );
    }
}

export default Animation;

когда я положил LottieView в <Pages> тег возвращает ошибку TypeError: undefined не является объектом (оценка 'this.animation.play')