I am creating an app using JavaScript and React Expo that needs a functionality where when I press a button it redirects the user to a page based on the button pressed, and that page has data from the previous page.

I’m using Expo Router for my page navigation.

Here is some of my current code of the page that has all the button options:

export default function createplanhome() {
    const [name, setName] = useState('');
    return (
        <View style={styles.container}>
            <View style={styles.columnContainer}>
                <Image source={require('./assets/logo.png')} style={styles.image} />
                <Text style = {styles.nameText}>Plan Name:</Text>
                    <TextInput 
                            style={styles.input} 
                            placeholder='e.g. Push Pull Legs'
                            onChangeText={(val) => setName(val)}
                        />
                <Link href="/pages/viewmonday" style = {styles.buttons}>Monday</Link>
                <Link href="/pages/viewtuesday" style = {styles.buttons}>Tuesday</Link>
                <Link href="/pages/viewwednesday" style = {styles.buttons}>Wednesday</Link>
                <Link href="/pages/viewthursday" style = {styles.buttons}>Thursday</Link>
                <Link href="/pages/viewfriday" style = {styles.buttons}>Friday</Link>

However, I have a separate page for each day of the week, which is not ideal – I just want to change this so that it’s only one page that can change its data based on what day is selected.

Here is the code for each day – the only thing changing is the name of the day, i.e. where it says “Monday” in the following code.

export default function viewmonday() {
    return (
        <View style={styles.container}>
            <Image source={require('./assets/logo.png')} style={styles.image} />
            <View style={styles.columnContainer}>
                <Text style = {styles.nameText}>Monday</Text>

I’d appreciate any help for this – thanks.

I tried to use a variable in each of the view day pages, but I’m not sure how to change that variable from the previous page’s choice.

return(
        <View style={styles.container}>
            <Image source={require('./assets/logo.png')} style={styles.image} />
            <View style={styles.columnContainer}>
               <Text style={styles.nameText}>{displayDay}</Text>