React native Video, how to dynamically change the source?

I'm trying to get a video to play in React-Native. The problem is that I'm able to use an relative path ("../videos/test.mp4") to achieve this, but when I use a variable like (this.state.path), then I get the following error message below.Could somebody please help me out?

ERRORClick here to see the error

Main class

export default class level1 extends React.Component {    constructor() {        super();        this.state = {            path: script[0].path,            repeat: script[0].repeat,            finished: false,            scriptIterator: 0        }        this.videoFinished = this.videoFinished.bind(this);    }    videoFinished() {        var i = this.state.scriptIterator + 1;        if (this.state.repeat) {            // clicklistener            console.warn("clicklistener");        }        this.setState({            finished: false,            scriptIterator: i,            path: script[i].path,            repeat: script[i].repeat        })    }    render() {        return (<View><VideoClass                    path={this.state.path}                    repeat={this.state.repeat}                    onEnd={this.videoFinished}                /></View>        )    }}const script =    [        { path: "../videos/APB.mp4", repeat: false },        { path: "../videos/test.mp4", repeat: true }    ]

VideoClass

export default class VideoClass extends React.Component {    constructor(props) {        super(props);        this.state = {            path: props.path,            repeat: props.repeat        }    }    render() {        return (<Video                source={require(this.state.path)}                 style={styles.backgroundVideo}                muted={true}                repeat={this.state.repeat}                resizeMode={"cover"}                rate={1.0}                ignoreSilentSwitch={"obey"}                onEnd={() => this.props.onEnd()}            />        );    }}